@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* ------------------------------------------------
Gakken LP / layout css
------------------------------------------------ */

* {margin: 0;padding: 0;}

html {font-size: 62.5%;width: 100%;}

body{
font-size: 1.7rem;
font-family: 'Noto Sans JP', sans-serif;
overflow-y:auto !important;
overflow-x:hidden !important;
background:#fff;
color:#000;
line-height:1.7;
width: 100%;
position: relative;
}

.clearfix::after {
content: "";
display: block;
clear: both;
}

img {vertical-align:top;}


a:hover img{
opacity: 0.6;
filter: alpha(opacity=60);
-moz-opacity:0.6;
}

a {color:#333;}
a:visited {color:#fff;}


/* layout
------------------------------------------------ */

header {width:100%;height:100px;background:#fff;z-index:10;}
header .inner {width:1200px;margin:auto;position:relative;}
header h1 {position:absolute;width:296px;height:50px;left:0;top:20px;}
header dl {background:#f3eedc;position:absolute;top:0;left:470px;width:732px;height:82px;}
header dl dt {width:400px;float:left;text-align:center;font-size:1.6rem;}
header dl dt strong {display:block;font-size:bold;font-size:2rem;padding:15px 0 0 0;margin:0;line-height:1.4;}
header dl dd {width:332px;float:right;}

header.fixed  {position: fixed;top: 0;left: 0;width:100%;height:74px;background:#f3eedc;z-index:10;}
header.fixed h1 {width:250px;height:auto;left:0;top:14px;}
header.fixed h1 img {width:100%;}
header.fixed dl {background:#f3eedc;position:absolute;top:0;left:550px;width:650px;height:74px;}
header.fixed dl dt {width:350px;float:left;text-align:center;line-height:1.5;}
header.fixed dl dt strong {display:block;font-size:bold;font-size:1.7rem;padding:13px 0 0 0;margin:0;line-height:1.4;}
header.fixed dl dd {width:300px;height:74px;}
header.fixed dl dd img {width:300px;height:74px;}

#mainvisual {width:100%;height:530px;background:url(../img/mainvisual_bg.jpg) center center no-repeat;}
#mainvisual .inner {width:1200px;margin:auto;}

#inqbox {width:100%;height:230px;background:url(../img/inqbox_bg.jpg) center center no-repeat;}
#inqbox .inner {width:1200px;margin:auto;position:relative;}
#inqbox .inner dl {position:absolute;left:40px;top:30px;font-weight:bold;}
#inqbox .inner dl dt {font-size:2.7rem;color:#fbbe00;}
#inqbox .inner dl dd {font-size:2.2rem;color:#fff;}
#inqbox .inner .btn {position:absolute;right:40px;top:50px;}
#inqbox .inner .note {position:absolute;left:0;top:180px;text-align:center;display:block;width:1200px;color:#fff;}


#contents {width:100%;background:url(../img/contents_bg.jpg) 0 0 repeat;}
#contents .inner {width:985px;margin:auto;padding:80px 0;position:relative;}
#contents .kokuban {width:985px;height:407px;background:url(../img/contents_kokuban.png) 0 0 no-repeat;}
#contents .kokuban dl {padding:50px 0 0 90px;}
#contents .kokuban dl dt {font-size:3.4rem;font-weight:bold;color:#ff9900;margin:0 0 30px 0;}
#contents .kokuban dl dd {font-size:2.2rem;color:#fff;padding:0 0 0 1em;line-height:1.8;}


#point {width:100%;}
#point .inner {width:1200px;padding:80px 0;margin:auto;position:relative;}
#point h2 {display:table;margin:0 auto 20px auto;font-size:4.4rem;color:#199342;text-align:center;border-bottom:3px solid #199342;}
#point h2 em {font-size:8rem;font-style:italic;letter-spacing:2px;}
#point .subtit {text-align:center;font-size:2.0rem;margin:0 auto 40px auto;}
#point h3 {display:table;margin:0 auto 20px auto;font-size:3.8rem;color:#ff9000;text-align:center;line-height:2;}
#point h3 span {display:table;margin:0 30px 0 0;float:left;height:80px;width:80px;border-radius:50%;line-height:80px;text-align:center;background:#ff9000;font-size:4.2rem;color:#fff;font-family: sans-serif;}
#point .inner .illust {display:block;margin:0 auto 30px auto;}

#point .box {position:relative;width:820px;padding:40px;margin:0 auto 50px auto;font-size:1.6rem;border:2px solid #62380a;background:#f7f3ed;}
#point .box .logo {width:140px;padding:2px 0 0 0;}
#point .box dl {}
#point .box dl dt {font-size:2.8rem;font-weight:bold;color:#62380a;padding:0 0 30px 80px;}
#point .box dl dd strong {font-size:2rem;font-weight:bold;color:#c00;}
#point .box .icon {position:absolute;top:-20px;left:-20px;}

#point h4 {display:table;margin:50px auto 40px auto;font-size:4.1rem;color:#076b28;text-align:center;background:linear-gradient(transparent 70%, #ffcc00 0%);line-height:1.3;}
#point h4 span {font-size:3rem;}

#point p.lead {font-size:1.8rem;width:900px;margin:0 auto 50px auto;}
#point p.lead strong {font-size:2rem;font-weight:bold;color:#c00;}

#point .inq {width:600px;margin:auto;padding:40px;position:relative;background:#f8f6ee;text-align:center;}
#point .inq strong {font-size:3rem;color:#076b28;}
#point .triangle {position:absolute;top:140px;left:40%;
width:0;height: 0;border-left: 50px solid transparent;border-right: 50px solid transparent;border-top: 50px solid #076b28;}


#inqbox2 {width:100%;height:280px;background:#2c6f43;padding:50px 0;}
#inqbox2 .inner {width:1200px;margin:auto;position:relative;}

#inqbox2 ul {display:table;list-style:none;margin:0 auto 40px auto;}
#inqbox2 ul li {float:left;width:300px;margin:0 40px 0 0;}

#inqbox2 .btn1 {display:block;width:296px;font-size:2.4rem;font-weight:bold;background:#e01919;border:2px solid #fff;border-radius:10px;box-shadow: 5px 5px 0px 0 rgba(0, 0, 0,0.3);color:#fff;text-decoration:none;text-align:center;padding:15px 0;}
#inqbox2 .btn1:hover {background:#ba0000;}

#inqbox2 .btn2 {display:block;width:296px;font-size:2.4rem;font-weight:bold;background:#7b9d14;border:2px solid #fff;border-radius:10px;box-shadow: 5px 5px 0px 0 rgba(0, 0, 0,0.3);color:#fff;text-decoration:none;text-align:center;padding:15px 0;}
#inqbox2 .btn2:hover {background:#506b00;}

#inqbox2 .btn3 {display:block;width:296px;font-size:2.4rem;font-weight:bold;background:#1b6ab4;border:2px solid #fff;border-radius:10px;box-shadow: 5px 5px 0px 0 rgba(0, 0, 0,0.3);color:#fff;text-decoration:none;text-align:center;padding:15px 0;}
#inqbox2 .btn3:hover {background:#004b92;}

#inqbox2 p {margin:0 0 40px 90px;color:#fff;}

#inqbox2 dl {display:table;width:830px;margin:0 auto;}
#inqbox2 dl dt {float:left;width:400px;font-size:1.6rem;color:#fff;text-align:right;line-height:1.5;}
#inqbox2 dl dt strong {font-size:2.6rem;font-weight:bold;}
#inqbox2 dl dd {float:right;width:430px;text-align:right;}


#voice {width:100%;}
#voice .inner {width:1200px;padding:80px 0;margin:auto;position:relative;}

#voice h2 {display:table;font-size:4rem;border-bottom:4px solid #ffa200;margin:0 auto 10px auto;letter-spacing:2px;}
#voice .subtit {text-align:center;font-size:1.6rem;color:#666;letter-spacing:4px;margin:0 0 60px 0;}

#voice dl {width:80%;margin:0 auto 40px auto;border-bottom:2px dotted #ccc;}
#voice dl dt {width:270px;float:left;padding:0 0 40px 0;text-align:center;}
#voice dl dd {color:#666;font-size:1.5rem;padding:20px 0 0 0;}
#voice dl dd p {margin:0 0 1em 0;font-size:1.6rem;}


#price {width:100%;background:#f4f2e9;}
#price .inner {width:1000px;padding:80px 0;margin:auto;position:relative;}

#price h2 {display:table;font-size:4rem;margin:0 auto 10px auto;letter-spacing:10px;}
#price p {text-align:center;margin:0 0 40px 0;}

#price ul {list-style:none;display:table;margin:0 auto 40px auto;}
#price ul li {float:left;}

#price .btn1 {display:block;width:130px;font-size:1.4rem;background:#de570d;border-radius:6px;color:#fff;text-decoration:none;text-align:center;padding:10px 0;margin:0 20px 0 0;line-height:1.3;}
#price .btn1 strong {font-size:2rem;}
#price .btn1:hover {background:#ad3d00;}

#price .btn2 {display:block;width:130px;font-size:1.4rem;background:#6d8c1a;border-radius:6px;color:#fff;text-decoration:none;text-align:center;padding:10px 0;margin:0 20px 0 0;line-height:1.3;}
#price .btn2 strong {font-size:2rem;}
#price .btn2:hover {background:#455f00;}

#price .btn3 {display:block;width:130px;font-size:1.4rem;background:#2a73b7;border-radius:6px;color:#fff;text-decoration:none;text-align:center;padding:10px 0;margin:0 20px 0 0;line-height:1.3;}
#price .btn3 strong {font-size:2rem;}
#price .btn3:hover {background:#00417e;}

#price .btn4 {display:block;width:130px;font-size:1.4rem;background:#8a2ab7;border-radius:6px;color:#fff;text-decoration:none;text-align:center;padding:10px 0;margin:0 20px 0 0;line-height:1.3;}
#price .btn4 strong {font-size:2rem;}
#price .btn4:hover {background:#630091;}

#price .btn5 {display:block;width:130px;font-size:1.4rem;background:#7d4009;border-radius:6px;color:#fff;text-decoration:none;text-align:center;padding:10px 0;margin:0 20px 0 0;line-height:1.3;}
#price .btn5 strong {font-size:2rem;}
#price .btn5:hover {background:#5c2c00;}

#price h3#price1 {font-size:3rem;color:#de570d;margin:0 0 10px 0;}
#price h4.price1 {background:#de570d;color:#fff;font-size:2.4rem;padding:5px 20px;}
#price table.price1 {width:100%;border-collapse:collapse;}
#price table.price1 th {background:#e9a176;padding:5px 20px;color:#fff;text-align:left;}
#price table.price1 td {background:#fff;padding:20px 20px;color:#333;text-align:left;}

#price h3#price2 {font-size:3rem;color:#6d8c1a;margin:40px 0 10px 0;}
#price h4.price2 {background:#6d8c1a;color:#fff;font-size:2.4rem;padding:5px 20px;}
#price table.price2 {width:100%;border-collapse:collapse;}
#price table.price2 th {background:#aebd7d;padding:5px 20px;color:#fff;text-align:left;}
#price table.price2 td {background:#fff;padding:20px 20px;color:#333;text-align:left;}

#price h3#price3 {font-size:3rem;color:#2a73b7;margin:40px 0 10px 0;}
#price h4.price3 {background:#2a73b7;color:#fff;font-size:2.4rem;padding:5px 20px;}
#price table.price3 {width:100%;border-collapse:collapse;}
#price table.price3 th {background:#96b4d0;padding:5px 20px;color:#fff;text-align:left;}
#price table.price3 td {background:#fff;padding:20px 20px;color:#333;text-align:left;}

#price h3#price4 {font-size:3rem;color:#8a2ab7;margin:40px 0 10px 0;}
#price h4.price4 {background:#8a2ab7;color:#fff;font-size:2.4rem;padding:5px 20px;}
#price table.price4 {width:100%;border-collapse:collapse;}
#price table.price4 th {background:#bd8acf;padding:5px 20px;color:#fff;text-align:left;}
#price table.price4 td {background:#fff;padding:20px 20px;color:#333;text-align:left;}

#price h3#price5 {font-size:3rem;color:#7d4009;margin:40px 0 10px 0;}
#price h4.price5 {background:#7d4009;color:#fff;font-size:2.4rem;padding:5px 20px;}
#price table.price5 {width:100%;border-collapse:collapse;}
#price table.price5 th {background:#b69574;padding:5px 20px;color:#fff;text-align:left;}
#price table.price5 td {background:#fff;padding:20px 20px;color:#333;text-align:left;}

#price table .time {width:7em;}
#price table .price {width:10em;}
#price table .pricetext {font-size:3rem;font-weight:bold;;color:#de570d;}


#flow {width:100%;background:#fff;}
#flow .inner {width:1000px;padding:80px 0;margin:auto;position:relative;}

#flow h2 {display:table;font-size:4rem;margin:0 auto 60px auto;letter-spacing:10px;}

#flow dl {margin:0 0 20px 0;}
#flow dt {padding: 14px 20px;background:#166d34;color:#fff;position: relative;font-size:2.4rem;cursor: pointer;}
#flow dd {padding: 60px;background: #f8f5ec;color:#363636;display: none;}

#flow dt img {margin:0 20px 0 0;vertical-align:middle;}
#flow dt.start {background:#d0305a;}

#flow dd .tel {width:480px;float:left;}

#flow dd .btn {float:right;display:block;width:296px;font-size:2rem;font-weight:bold;background:#f96f00;border:2px solid #fff;border-radius:10px;box-shadow: 2px 2px 0px 0 rgba(0, 0, 0,0.3);color:#fff;text-decoration:none;text-align:center;padding:15px 0;margin:20px 20px 0 0;}
#flow dd .btn:hover {background:#ca5a00;}

#flow .note {text-align:center;padding:30px 0 0 0;}



#qa {width:100%;background:#e9e9e9;}
#qa .inner {width:1000px;padding:80px 0;margin:auto;position:relative;}

#qa h2 {display:table;font-size:4rem;margin:0 auto 60px auto;letter-spacing:10px;}
#qa h3 {background:#166d34;font-size:2.4rem;padding:20px;color:#fff;font-weight:normal;letter-spacing:1px;}

#qa dl {margin:0 0 0 0;}
#qa dt {padding: 14px 20px;background:#48b06c;color:#fff;position: relative;font-size:2rem;cursor: pointer;border-bottom:1px solid #fff;}
#qa dt:before {content:"Q. ";font-size:3rem;}
#qa dd {padding: 40px 60px 40px 90px;background: #f8f5ec;color:#363636;display: none;}
#qa dd:before {content:"A. ";font-size:3rem;margin:0 0 0 -1.1em;}


footer {padding:50px;font-size:1.4rem;text-align:center;background:#199242;color:#fff;}
footer a {color:#fff;}

/*.foot {padding:50px 0 130px 0 !important;}*/

#inq_floating {
background:#66bd54;
width:100%;
z-index:100;
margin:0;
position:fixed;
text-align:center;
}

#inq_floating dl {width:800px;height:82px;margin:auto;}
#inq_floating dl dt {width:400px;float:left;color:#fff;text-align:center;}
#inq_floating dl dt strong {display:block;font-size:bold;font-size:2rem;padding:15px 0 0 0;margin:0;line-height:1.4;}
#inq_floating dl dd {width:400px;float:right;font-size:1.5rem;}


/* Accoudion
------------------------------------------------ */


.toggle_btn {
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	display: block;
	width: 30px;
	height: 30px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
.toggle_btn:before, .toggle_btn:after {
	display: block;
	content: '';
	background-color: #fff;
	position: absolute;
	width: 20px;
	height: 3px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.toggle_btn:before {
	width: 3px;
	height: 20px;
}
.toggle_title.selected .toggle_btn:before {
	content: normal;
}


/* effect
------------------------------------------------ */

 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 600ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}