@charset "utf-8";
/*------ベース-----*/


/* 共通設定 */

body {
	font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN",  Arial, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	padding: 0;
	margin: 0;
	line-height: 1.7;
	background-color: #FFFEE8;
   
    
}
.main_contents .form-group label{line-height: 22px!important;}


.main_contents h2,
.main_contents h3,
.main_contents h4{font-family: "Noto Sans JP", sans-serif;
font-weight: 800;}


a:hover{
	opacity: 0.7;
}

ul.link{display: flex;
justify-content: center;
list-style-type: none!important;
/*margin-left: 0!important;*/
}

ul.link li{width: 80%;}
/*ul.link li{width: 48%;}*/

ul.link3 li{width: 32%;}

ul.link li a{display: block;
box-sizing: border-box;
font-weight: 900;
color: #fff;
position: relative;
text-decoration: none;
text-align: center;
padding: 15px;
border-radius: 50px;
font-size: 30px;
margin: 0 auto;}
ul.link li.kobo a{background: #F9A600;
background: linear-gradient(90deg, rgba(249, 166, 0, 0.94) 0%, rgba(255, 0, 111, 1) 100%);}

ul.link li.tsuhan a{background: #30c291;
background: linear-gradient(90deg, rgba(48, 194, 145, 1) 0%, rgba(35, 139, 250, 1) 100%);}

ul.link li.mail a{background: #d4ce90;
background: linear-gradient(90deg, rgba(212, 206, 144, 1) 0%, rgba(179, 135, 41, 1) 100%);}

.link a:after{content:"";
    display: block;
    width: 12px;
    height: 12px;
    position: absolute;
    left: 90%;
    top: 40px;
    background-image: url(../img/link.png);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: auto 12px;}

.header{box-sizing: border-box;
	display: block;
	background-color: #FFFFFF;
	box-shadow: 0 0 5px #AAAAAA;
	margin: 0;
	padding: 0;
}
.header .header_box{
	display: flex;
	flex-wrap: nowrap;
	align-items: stretch;
	align-content: stretch;
	justify-content: space-between;
	max-width: 1200px;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 20px 0px;
}
.header .header_box h1{
	padding: 0px 0;
	margin: 0;
	max-width:260px;
}
.header .header_box h1 img{
	display: block;
}

.header .header_box .header_box_right{ margin: 20px 0 0 0;
    width: calc(100% - 350px);}
.header .header_box .header_box_right ul,
footer .header_box_right ul{display: flex;
  justify-content: space-around;
	margin: 0;

}

.header .header_box .header_box_right ul li{}
.header .header_box .header_box_right a{
	text-align: center;
	display: block;
	vertical-align: middle;
	
	box-sizing: border-box;
	color: #000;
	text-decoration: none;
	padding: 0px 5px;
	font-size: 18px;
    font-weight: 800;
}


/*------------------*/

.footer{
	display: block;
	background-color: #444;
}

.footer .about img{
	display: block;
	width: 300px;
	margin: 0 auto 10px;
    filter: invert(100%);
}
footer .header_box_right{float: right;
width:55%;}

.footer .copy{
	background-color: #333;
	color: #FFFFFF;
	margin: 0;
	padding: 5px;
	text-align: center;
    font-size: 14px;
}
.footer .copy a{
	color: #FFFFFF;
	text-decoration: none;
}
  
.contact dl{margin: 0 auto 30px auto;}  
    
.contact dl dt{background: #000;
    color: #fff;
    padding: 0px 5px;
    width: 4em;
    float:left;
text-align: center;}
    
.contact dl dd{padding: 0px 0 10px 5em;
    text-align: left;
    margin: 0 0 10px 0;
border-bottom: 1px solid #ccc;}
/*-----------------------------------*/

.main_contents{ overflow: hidden!important;
}
.main_contents p{
	margin: 0 0 1.5em;
}

.outbox{
	display: block;
	max-width: 1200px;
	padding: 10px;
	margin: 0 auto;
}

p.center{text-align: center;}

.bold{font-weight: bold}

.red{color: #BE0001;}

.space{
	display: block;
	height: 80px;
}
.space2{
	display: block;
	height: 40px;
}
.bg_white{
	display: block;
	background-color: #FFFFFF;
}
.bg_gray{
	display: block;
	background-color: #EEEEEE;
}.bg_black{
	display: block;
	background-color: #333;
}

.bg_img{
	background-image: url(../img/topimg_bg.jpg);
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.bg_white2{background-image: url("../img/bg_white2.png");
	background-size: contain;
	background-position:center top;
    background-repeat: no-repeat;
	overflow: hidden;
background-color: #fff;}

/*-----------------------------------*/

.topimg_bg{background-color: #FCFFB4;
    background-image: url(../img/topimg_bg.png);
    background-repeat: no-repeat;
	background-size: contain;
	background-position: center top;
	overflow: hidden;
}

.topimg{max-width: 1200px;
margin: 0 auto;}

.topimg img{
	display: block;
	
	margin: 0 auto;
}

.white_box{
	display: block;
	padding: 15px;
	background:rgba(255,255,255,0.5);
	border-radius: 15px;
}

dl.kome{
	overflow: hidden;
}
dl.kome dt{
	float: left;
}
dl.kome dd{
	padding: 0 0 5px 2em;
}



.contact_link{
	background-image: url(../img/topimg_bg.jpg);
	background-size: cover;
	background-position: center;
	display: block;
	margin: 0 auto;
	padding: 0 10px;
	text-align: center;
	overflow: hidden;
	box-sizing: border-box;
}
.bg_img .contact_link{
	background-image: none;
}


.contact_link p{
	display: block;
	max-width: 1000px;
	margin: 0 auto;
	padding: 0;
}
.contact_link p a{
	display: block;
	box-sizing: border-box;
	padding: 0px;
	transition: all 0.2s ease-out;
}
.contact_link p a:hover{
	opacity: 1;
	transform: scale(1.02);
}
.contact_link p a img{
	display: block;
}

p.text_center_large{
	font-size: 40px;
	font-weight: bold;
	line-height: 1.7;
	text-align: center;
	padding: 0;
	margin: 0;
	color: #333333;
	text-shadow: 3px 3px #FFFFFF;
}

p.text_center_large strong{
	color: #e72f70;
	font-size: 110%;
}

.main_contents .outbox h2{font-family: "Noto Sans JP", sans-serif;
	font-size: 3em;
	color: #333333;
	text-align: center;
	display: block;
	padding: 0;
	margin: 0 0 100px;
	font-weight:900!important;
	line-height: 1.4;
	clear: both;
	position: relative;
}

.main_contents h2.h2style{
	font-size: 2em;
	
}

.main_contents .outbox h2 .small{font-size: 30px;
display: block;
font-weight:900!important;
color: #333;}

.main_contents .outbox h2::after{
	position: absolute;
	content: "";
	display: block;
	bottom: -30px;
	width: 15%;
	left: 45%;
	border-bottom: 5px solid #FFD500;
}
.main_contents .outbox h2.h2style::after{
	position: absolute;
	content: "";
	display: block;
	bottom: -30px;
	width: 7.5%;
	left: 47.5%;
	border-bottom: 5px solid #FFD500;
}

.main_contents .outbox h2.bgnone{font-size: 2.5em;
margin: 0 0 1em 0;}


.main_contents .outbox h2.bgnone::after{content:none;}


.osusume_img{width: 30%;
max-width: 300px;
float: right;}

ul.check_list{
	font-size: 25px;
    font-weight: 800;
	line-height: 1.5;
    width: calc(100% - 350px);
}
ul.check_list li{background: url("../img/check.png") no-repeat left 0.3em;
    background-size: auto 1em;
	position: relative;
	padding: 0 0 15px 1.5em;
	margin: 0 0 15px;
	border-bottom: 3px dotted #CDE5F7;
}
ul.check_list li strong{color: #387FBC;}

ul.riyu_list{display: flex;
justify-content: space-around;
margin-bottom: 80px;
flex-wrap: wrap;}
ul.riyu_list li{width: 30%;
	box-sizing: border-box;
	padding:0;
	margin: 0 auto;
	overflow: hidden;

}
ul.riyu_list li figure{width: 90%;
	
	display: block;
}
ul.riyu_list li figure img{
	display: block;
	margin: 0;
	padding: 0;
}
ul.riyu_list li p{
	text-align: center;
	padding: 0;
	margin: 0;
	line-height: 1.5;
}
ul.riyu_list li p strong{font-weight: 900;
	
	font-size: 42px;
    display: inline;
    background:linear-gradient(transparent 70%, #ff6 70%);
	
}

ul.riyu_list li:nth-child(even) figure{
	order: 2;
}
ul.riyu_list li:nth-child(even) p{
	order: 1;
}

ol.step{counter-reset:number; /*数字をリセット*/
  list-style-type: none!important; /*数字を一旦消す*/}
ol.step li{position: relative;
	box-sizing: border-box;
	padding: 0 0 70px 80px;
	margin: 0 0 40px;
    background-image: url(../img/arrow.png);
	background-size: auto 30px;
	background-repeat: no-repeat;
	background-position: center bottom;

}

ol.step li strong{display: block;
font-weight: 900;
font-size: 25px;}

ol.step li::before{
	/* 以下数字をつける */
  position: absolute;
  counter-increment: number;
  content: counter(number);
  /*以下数字のデザイン変える*/
  display:inline-block;
  background:#FFBE4D;
  color: white;
  font-weight:bold;
  font-size: 22px;
  border-radius: 50%;
  left: 0;
  width: 65px;
  height: 65px;
  line-height: 65px;
  text-align: center;
  top: 0%;
	
}

ol.step li:last-of-type{background-image: none;
padding-bottom: 0;
margin-bottom: 0;}


/*-----------------------------------*/

.main_contents .outbox .point h3{
font-weight: 800;
font-size: 1.4em;
line-height: 1.5;
margin-bottom: 1em;}

.border_box{border: 5px solid #FFFF00;
background-color: #fff;}

.point .border_box p{margin-bottom: 0;}

.info dl{display: flex;
flex-wrap: wrap;
margin: 0 0 20px 0;}

.info dl dt{width: 6em;}
.info dl dd{width:calc(100% - 7em)}

.main_contents .info h3{font-size: 25px;
font-weight: 600!important;
border-bottom: 1px solid #387FBC;
margin: 0 0 10px 0;
padding-bottom: 5px;}

.info h4{font-weight: 700;
font-size: 20px;}

.info ul{list-style-type: disc;
font-size: 17px;
margin: 0 0 20px 1.5em;}


.flexbox .textbox h3{font-weight: 900;
line-height: 1.5;
font-size: 1.3em;}

.flexbox .imgbox{display: flex;
justify-content: space-between;}
.flexbox .imgbox figure{width: 48%;}
.flexbox .imgbox figure img{border: 1px solid #aaa;} 



dl.qa{background: #fff;
margin: 0 0 40px 0;}
dl.qa dt{
	position: relative;
	font-weight: 900;
    border-bottom: 1px solid #ccc;
}


dl.qa dt::before {
	content: "Q";
	font-family: Arial, Helvetica, "sans-serif";
	color:#387FBC;
	text-align: center;
	display: block;
	float: left;
    font-weight: bold;	
}







dl.qa dd{
	margin: 0px 0px 0px;
	position: relative;
}
dl.qa dd::before {
	content: "A";
    font-family: Arial, Helvetica, "sans-serif";
	color:#FF8EBF;
	text-align: center;
	display: block;
	float: left;
font-weight: bold;
}

#page_top{
  width: 60px;
  height: 60px;
  position: fixed;
  right: 0;
  bottom: 20px;
  opacity: 0.6;
}
#page_top a{
  width: 60px;
  height: 60px;
  text-decoration: none;
}
#page_top a::before{
	font-family: FontAwesome;
	content: '\f139';
	font-size: 60px;
	color: #888888;
}