@charset "utf-8";
#wrapper { background: #c2e9fb;}
.bg-sct { background: url('../img/top/bg-kv.jpg?v=1.0') no-repeat 50% 0% / 2000px auto;}

#kv { position: relative;}
#kv .inner-kv { padding: 220px 0 120px;}
#kv .kv-txt { width: 90%; max-width: 1200px; margin: 0 auto;}
#kv .kv-txt h1 { text-align: center;}
#kv .kv-txt h1 img { width: 60%; max-width: 380px;}
#kv .kv-txt p { font-size: 20px; font-weight: 700; line-height: 1.8; text-align: center;}
#kv .kv-ctn { display: flex; justify-content: space-between; width: 94%; max-width: 1200px; margin: 0 auto;}
#kv .kv-ctn .box { width: 32%; font-size: 0px;}
#kv .kv-ctn .box a { position: relative; display: block; width: 96%; margin: 0 auto; padding-top: 30px; color: #000; text-decoration: none;}
#kv .kv-ctn .box a span { position: absolute; top: 0px; width: 100%; text-align: center; z-index: 2;}
#kv .kv-ctn .box a span img { width: 80%; border-radius: 50px;}
#kv .kv-ctn .box a dl { position: relative; border-radius: 20px; box-shadow: 0px 4px 12px #becbdb; overflow: hidden; z-index: 1;}
#kv .kv-ctn .box a.type-1 dl { background: #0c66a5;}
#kv .kv-ctn .box a.type-2 dl { background: #e6c229;}
#kv .kv-ctn .box a.type-3 dl { background: #74a57f;}
#kv .kv-ctn .box a dl dt { position: relative; background: #fff; padding-top: 55%; text-align: center;}
#kv .kv-ctn .box a dl dt img { position: absolute; width: 55%; left: 50%; top: 50%; transform: translate(-50%,-40%); transition: 0.4s ease;}
#kv .kv-ctn .box a dl dd { background: #fff;}
#kv .kv-ctn .box a dl dd.txt { min-height: 8em; padding: 6px 35px 20px; font-size: 18px; letter-spacing: 0.05rem;}
#kv .kv-ctn .box a dl:before,
#kv .kv-ctn .box a dl:after { content: ''; display: block; width: 0px; height: 0px; position: absolute; z-index: 2;}
#kv .kv-ctn .box a dl:before{ border: solid 42px transparent; bottom: 0px; right: 0px;}
#kv .kv-ctn .box a dl:after { border: solid 10px transparent; border-left: solid 16px #fff; border-right: 0px; bottom: 15px; right: 16px;}
#kv .kv-ctn .box a.type-1 dl:before { border-bottom: solid 42px #0c66a5; border-right: solid 42px #0c66a5; }
#kv .kv-ctn .box a.type-2 dl:before { border-bottom: solid 42px #e6c229; border-right: solid 42px #e6c229; }
#kv .kv-ctn .box a.type-3 dl:before { border-bottom: solid 42px #74a57f; border-right: solid 42px #74a57f; }
#kv .kv-ctn .box a:hover { opacity: 0.9;}
#kv .kv-ctn .box a img.sp { display: none;}
@media (min-width: 641px) {
	#kv .kv-ctn .box a:hover dl dt img { transform: translate(-50%,-40%) scale(1.08);}
}
@media (max-width: 1201px) {
	#kv .kv-ctn .box a dl dd.txt { min-height: 10em;}
}
@media (max-width: 1001px) {
	#kv .inner-kv { padding: 120px 0 80px;}
	#kv .kv-ctn .box a dl dd.txt { font-size: 1.6vw;}
}
@media (max-width: 801px) {
	.bg-sct { background: url('../img/top/bg-kv-sp.jpg?v=1.0') no-repeat 50% 0% / 100% auto;}
	#kv { margin-bottom: 0px;}
	#kv .inner-kv { padding: 28vw 0 16vw;}
	#kv .kv-txt h1 { margin-bottom: 6vw;}
	#kv .kv-ctn .box a { padding-top: 20px;}
	#kv .kv-ctn .box a dl { border-radius: 15px;}
	#kv .kv-ctn .box a dl dd.txt { padding: 4px 25px 15px;}
	#kv .kv-ctn .box a dl:before{ border: solid 30px transparent;}
	#kv .kv-ctn .box a dl:after { border: solid 8px transparent; border-left: solid 12px #fff; border-right: 0px; bottom: 10px; right: 10px;}
	#kv .kv-ctn .box a.type-1 dl:before { border-bottom: solid 30px #0c66a5; border-right: solid 30px #0c66a5; }
	#kv .kv-ctn .box a.type-2 dl:before { border-bottom: solid 30px #e6c229; border-right: solid 30px #e6c229; }
	#kv .kv-ctn .box a.type-3 dl:before { border-bottom: solid 30px #74a57f; border-right: solid 30px #74a57f; }
}
@media (max-width: 641px) {
	#kv .kv-txt p span { display: block;}
	#kv .kv-ctn .box a { padding-top: 0px; border-radius: 15px; box-shadow: 0px 4px 12px #becbdb; overflow: hidden;}
	#kv .kv-ctn .box a span { display: none;}
	#kv .kv-ctn .box a dl { display: none;}
/*
	#kv .kv-ctn .box a dl dt { display: block;}
	#kv .kv-ctn .box a dl dt img { width: 100%;}
	#kv .kv-ctn .box a dl dd.fig { padding: 10px 0 20px;}
	#kv .kv-ctn .box a dl dd.fig img { position: relative; left: auto; top: auto; transform: translate(0,0); width: 90%;}
	#kv .kv-ctn .box a dl dd.txt { display: none;}
*/
	#kv .kv-ctn .box a img.sp { display: block; width: 100%;}
}

@media (max-width: 481px) {
	#kv .inner-kv { padding: 30vw 0 10vw;}
	#kv .kv-txt h1 { margin-bottom: 3vw;}
	#kv .kv-txt p { font-size: 16px;}
	#kv .kv-ctn .box a { border-radius: 10px; box-shadow: 0px 2px 8px #becbdb;}
	#kv .kv-ctn .box a dl:before{ border: solid 20px transparent;}
	#kv .kv-ctn .box a dl:after { border: solid 6px transparent; border-left: solid 8px #fff; border-right: 0px; bottom: 6px; right: 8px;}
	#kv .kv-ctn .box a.type-1 dl:before { border-bottom: solid 20px #0c66a5; border-right: solid 20px #0c66a5;}
	#kv .kv-ctn .box a.type-2 dl:before { border-bottom: solid 20px #e6c229; border-right: solid 20px #e6c229;}
	#kv .kv-ctn .box a.type-3 dl:before { border-bottom: solid 20px #74a57f; border-right: solid 20px #74a57f;}
	#kv .kv-ctn .box a dl dd.fig { padding: 8px 0 16px;}
}


.ttl h2 { color: #0c66a5; font-size: 26px; line-height: 1.2; text-align: center;}
.ttl h2 span { display: inline-block; padding-bottom: 16px; background: url('../img/bg-ttl.png?v=1.0') repeat-x 50% 100% / 10px auto;
 color: #0f2b6c; font-size: 42px; font-weight: 900;
}
@media (max-width: 801px) {
	.ttl h2 { font-size: 2.5vw;}
	.ttl h2 span{ font-size: 4.0vw;}
}
@media (max-width: 641px) {
	.ttl h2 span { font-size: 24px;}
}
@media (max-width: 481px) {
	.ttl h2 { font-size: 13px;}
	.ttl h2 span { padding-bottom: 10px; background-size: 8px auto; font-size: 21px;}
}



#lead { position: relative; margin-bottom: -140px; background: url('../img/top/bg-1.png?v=1.0') no-repeat 50% 90% / 2000px auto;}
#lead .inner-sct { position: relative;}
#lead .box { position: relative; width: 90%; max-width: 1100px; margin: 0 auto;}
#lead .box .inner { width: 100%; background: #fff; padding: 60px 70px 50px; border-radius: 30px; box-shadow: 0px 4px 12px #becbdb;}
#lead .box .ttl { margin-bottom: 40px;}
#lead .box p { margin-bottom: 20px; font-size: 18px; line-height: 2; letter-spacing: 0.05rem;}
#lead .box figure img { width: 100%;}
#lead .btn { display: none; width: 65%; margin: 0 auto;}
#lead .btn a { display: block; padding: 6px 0; background: #0f2b6c; border-radius: 8px;
 color: #fff; font-size: 14px; font-weight: 700; text-align: center; text-decoration: none;
}
@media (max-width: 1401px) {
}
@media (max-width: 1001px) {
	#lead .box .inner { padding: 40px 50px;}
	#lead .box p { font-size: 1.6vw;}
}
@media (max-width: 801px) {
	#lead { margin-bottom: 0px;}
	#lead .inner-sct { padding: 40px 0;}
	#lead .box .ttl { margin-bottom: 20px;}
	#lead .box p { font-size: 14px;}
}
@media (max-width: 641px) {
	#lead .box .inner { padding: 30px; border-radius: 20px;}
	#lead .box figure { margin-bottom: 15px;}
	#lead .btn { display: block;}
}
@media (max-width: 481px) {
	#lead .inner-sct { padding: 0px 0 30px;}
	#lead .box .inner { padding: 30px 25px 20px; border-radius: 12px;}
	#lead .box .ttl { margin-bottom: 12px;}
	#lead .box p { font-size: 12px; letter-spacing: 0.025rem;}
}


#yesno { position: relative; background: url('../img/top/bg-2.png?v=1.0') no-repeat 50% 0 / 2000px auto;}
#yesno .inner-sct { width: 92%; max-width: 1024px; margin: 0 auto; padding: 300px 0px 240px;}
#yesno figure img { width: 100%;}
#yesno .ttl { margin-bottom: 30px;}
#yesno figure { text-align: center;}
#yesno figure img { width: 100%;}
#yesno .ctn-flex { display: flex; width: 100%; max-width: 1100px; margin: 0 auto;}
#yesno .box { width: 25%; font-size: 0px;}
#yesno .box a { position: relative; display: block; width: 92%; margin: 0 auto; background: #fff; border-radius: 20px; overflow: hidden; box-shadow: 0 8px 10px #cfcfcf;
 color: #000; text-decoration: none;
}
#yesno .box a.type-1 { border: solid 3px #0c66a5; background: #0c66a5;}
#yesno .box a.type-2 { border: solid 3px #e6c229; background: #e6c229;}
#yesno .box a.type-3 { border: solid 3px #74a57f; background: #74a57f;}
#yesno .box a.type-4 { border: solid 3px #0f2b6c; background: #0f2b6c;}
#yesno .box a:before,
#yesno .box a:after { content: ''; display: block; width: 0px; height: 0px; position: absolute; z-index: 2;}
#yesno .box a:before{ border: solid 30px transparent; bottom: 0px; right: 0px;}
#yesno .box a:after { border: solid 8px transparent; border-left: solid 12px #fff; border-right: 0px; bottom: 10px; right: 10px;}
#yesno .box a.type-1:before { border-bottom: solid 30px #0c66a5; border-right: solid 30px #0c66a5; }
#yesno .box a.type-2:before { border-bottom: solid 30px #e6c229; border-right: solid 30px #e6c229; }
#yesno .box a.type-3:before { border-bottom: solid 30px #74a57f; border-right: solid 30px #74a57f; }
#yesno .box a.type-4:before { border-bottom: solid 30px #0f2b6c; border-right: solid 30px #0f2b6c; }
#yesno .box a dl dt { line-height: 1;}
#yesno .box a dl dt img { width: 100%;}
#yesno .box a dl dt img.sp { display: none;}
#yesno .box a dl dd { position: relative; background: #fff;}
#yesno .box a dl dd.fig { position: relative; padding-top: 55%; text-align: center;}
#yesno .box a dl dd.fig img { position: absolute; width: 80%; max-width: 150px; left: 50%; top: 50%; transform: translate(-50%,-45%); transition: 0.4s ease;}
#yesno .box a dl dd.txt { height: 11.4em; padding: 5px 30px; font-size: 16px; line-height: 1.5;}
#yesno .box a dl dd.txt span.note { display: block; padding-top: 8px; font-size: 14px;}
#yesno .box a:hover { opacity: 0.8;}
@media (min-width: 801px) {
	#yesno .box a:hover dl dd.fig img { transform: translate(-50%,-45%) scale(1.08);}
}
@media (max-width: 1001px) {
	#yesno .box a dl dd.txt{ height: 10.2em; padding: 5px 20px; font-size: 14px;}
	#yesno .box a dl dd.txt span.note { font-size: 12px;}
}
@media (max-width: 801px) {
	#yesno { background: url('../img/top/bg-2-sp.png?v=1.0') no-repeat 50% 50% / 100% 100%;}
	#yesno .inner-sct { padding: 80px 0px 100px;}
	#yesno .box a:before{ border: solid 26px transparent;}
	#yesno .box a:after { border: solid 6px transparent; border-left: solid 10px #fff; border-right: 0px; bottom: 8px; right: 8px;}
	#yesno .box a.type-1:before { border-bottom: solid 26px #0c66a5; border-right: solid 26px #0c66a5; }
	#yesno .box a.type-2:before { border-bottom: solid 26px #e6c229; border-right: solid 26px #e6c229; }
	#yesno .box a.type-3:before { border-bottom: solid 26px #74a57f; border-right: solid 26px #74a57f; }
	#yesno .box a.type-4:before { border-bottom: solid 26px #0f2b6c; border-right: solid 26px #0f2b6c; }
	#yesno .box a dl dt img.pc { display: none;}
	#yesno .box a dl dt img.sp { display: block;}
	#yesno .box a dl dd.fig { padding: 30px 0;}
	#yesno .box a dl dd.fig img { position: relative; left: auto; top: auto; transform: translate(0%,0%);}
	#yesno .box a dl dd.txt { display: none;}
}
@media (max-width: 641px) {
	#yesno .box a { border-width: 2px !important; border-radius: 10px;}
	#yesno .box a dl dd.fig { padding: 20px 0;}
}
@media (max-width: 481px) {
	#yesno .inner-sct { padding: 50px 0px 60px;}
	#yesno .ttl { margin-bottom: 20px;}
	#yesno .box a { border-radius: 8px; box-shadow: 0 2px 8px #cfcfcf;}
	#yesno .box a:before{ border: solid 12px transparent;}
	#yesno .box a:after { border: solid 4px transparent; border-left: solid 6px #fff; border-right: 0px; bottom: 3px; right: 3px;}
	#yesno .box a.type-1:before { border-bottom: solid 12px #0c66a5; border-right: solid 12px #0c66a5; }
	#yesno .box a.type-2:before { border-bottom: solid 12px #e6c229; border-right: solid 12px #e6c229; }
	#yesno .box a.type-3:before { border-bottom: solid 12px #74a57f; border-right: solid 12px #74a57f; }
	#yesno .box a.type-4:before { border-bottom: solid 12px #0f2b6c; border-right: solid 12px #0f2b6c; }
	#yesno .box a dl dd.fig { padding: 12px 0;}
}



aside.bnr div { width: 88%; max-width: 820px; margin: 0 auto; padding: 0 0 60px;}
aside.bnr a { display: block; width: 100%; border-radius: 20px; overflow: hidden; box-shadow: 0px 4px 12px #becbdb;}
aside.bnr a img { width: 100%;}
aside.bnr a:hover { opacity: 0.8;}
@media (max-width: 481px) {
	aside.bnr div { padding: 40px 0;}
	aside.bnr a { border-radius: 12px; box-shadow: 0px 2px 8px #becbdb;}
}

#ft { background: #c2e9fb;}
#ft .copyright p { color: #636363;}