@charset "utf-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 リセット 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.content { max-width: none; padding-right: 0; padding-left: 0; }

#baseWarp { font-size: 62.5%; line-height: 1; color: #333333; font-weight: 500; }
#baseWarp img { width: 100%; height: auto; vertical-align: top; }

.taC { text-align: center; }





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 コンテンツ間隔 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.mb05 { margin-bottom: 5px; }
.mb06 { margin-bottom: 6px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }
.mb120 { margin-bottom: 120px; }
.mb140 { margin-bottom: 140px; }
.mb160 { margin-bottom: 160px; }
.mb180 { margin-bottom: 180px; }
.mb200 { margin-bottom: 200px; }

@media screen and (max-width: 767px) {
	.mb20 { margin-bottom: 10px; }
	.mb30 { margin-bottom: 15px; }
	.mb40 { margin-bottom: 20px; }
	.mb50 { margin-bottom: 25px; }
	.mb60 { margin-bottom: 30px; }
	.mb70 { margin-bottom: 35px; }
	.mb80 { margin-bottom: 40px; }
	.mb90 { margin-bottom: 45px; }
	.mb100 { margin-bottom: 50px; }
	.mb120 { margin-bottom: 60px; }
	.mb140 { margin-bottom: 70px; }
	.mb160 { margin-bottom: 80px; }
	.mb180 { margin-bottom: 90px; }
	.mb200 { margin-bottom: 100px; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 changeImg：2点の画像入れ替え 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.changeImg div:nth-child(2) { display: none; }

@media screen and (max-width: 767px) {
	.changeImg div:nth-child(1) { display: none; }
	.changeImg div:nth-child(2) { display: block; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 diB：各種 display inline-block 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.diB,
.diBI,
.diBB { display: inline-block; }
.dBI { display: block; }

@media screen and (max-width: 767px) {
	.diBI { display: inline; }
	.diBB { display: block; }
	.dBI { display: inline; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 mainHead 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

#mainHead { background: url(../images/head_main1.jpg) no-repeat center top; background-size: 1220px auto; padding-right: calc( 50 / 1000 * 100% ); padding-left: calc( 50 / 1000 * 100% ); margin-bottom: 50px; }
#mainHead .headInner { max-width: 900px; margin-right: auto; margin-left: auto; }
#mainHead .headTitle { font-size: 0; line-height: 0; padding-top: calc( 630 / 900 * 100% ); }

@media screen and (max-width: 1000px) {
	#mainHead { background-size: cover; }
}

@media screen and (max-width: 767px) {
	#mainHead { background: none;  padding-right: 0; padding-left: 0; margin-bottom: 30px; }
	#mainHead .headInner { max-width: 500px; }
	#mainHead .headTitle { background: url(../images/head_main2.jpg) no-repeat center top; background-size: 100% auto;  padding-top: calc( 340 / 320 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 subHead 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

#subHead { padding: 0 calc( 50 / 1000 * 100% ) 60px; }
#subHead .headInner { max-width: 900px; margin-right: auto; margin-left: auto; }
#subHead .headTxt { max-width: 820px; font-size: 1.8rem; line-height: 3.6rem; font-feature-settings: "palt"; letter-spacing: 2px; margin: 0 auto 50px; }
#subHead .headAnchor { font-size: 0; line-height: 0; }
#subHead .headAnchor a { display: inline-block; width: calc( 172 / 900 * 100% ); background: no-repeat left top; background-size: cover; padding-top: calc( 185 / 900 * 100% ); }
#subHead .headAnchor a:not(:last-child) { margin-right: calc( 10 / 900 * 100% ); }
#subHead .headAnchor a:nth-child(1) { background-image: url(../images/head_anchor1.gif); }
#subHead .headAnchor a:nth-child(2) { background-image: url(../images/head_anchor2.gif); }
#subHead .headAnchor a:nth-child(3) { background-image: url(../images/head_anchor3.gif); }
#subHead .headAnchor a:nth-child(4) { background-image: url(../images/head_anchor4.gif); }
#subHead .headAnchor a:nth-child(5) { background-image: url(../images/head_anchor5.gif); }

@media screen and (min-width: 769px) {
	#subHead .headAnchor a { transition: 0.2s ease; }
	#subHead .headAnchor a:hover { opacity: 0.6; }
}

@media screen and (max-width: 767px) {
	#subHead { padding: 0 calc( 20 / 320 * 100% ) 60px; }
	#subHead .headInner { max-width: 500px; }
	#subHead .headTxt { font-size: 1.6rem; line-height: 3rem; margin-bottom: 30px; }
	#subHead .headAnchor { max-width: 380px; margin-right: auto; margin-left: auto; }
	#subHead .headAnchor a { display: inline-block; width: calc( 134 / 280 * 100% ); padding-top: calc( 144 / 280 * 100% ); }
	#subHead .headAnchor a:not(:last-child) { margin-right: 0; }
	#subHead .headAnchor a:nth-child(odd) { margin-right: calc( 12 / 280 * 100% ); }
	#subHead .headAnchor a:nth-child(n+3) { margin-top: calc( 12 / 280 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 wrapBlock 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

#wrapBlock1,
#wrapBlock2,
#wrapBlock3,
#wrapBlock4,
#wrapBlock5 { padding: 60px calc( 50 / 1000 * 100% ); }
#wrapBlock1 { background-color: #f0faff; }
#wrapBlock2 { background-color: #fff0eb; }
#wrapBlock3 { background-color: #f0faff; }
#wrapBlock4 { background-color: #fff0eb; }
#wrapBlock5 { background-color: #f0faff; }
#wrapBlock1 .blockInner,
#wrapBlock2 .blockInner,
#wrapBlock3 .blockInner,
#wrapBlock4 .blockInner { max-width: 900px; margin-right: auto; margin-left: auto; }
#wrapBlock5 .blockInner { max-width: 1000px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 767px) {
	#wrapBlock1,
	#wrapBlock2,
	#wrapBlock3,
	#wrapBlock4,
	#wrapBlock5 { padding: 40px calc( 20 / 320 * 100% ); }
	#wrapBlock1 .blockInner,
	#wrapBlock2 .blockInner,
	#wrapBlock3 .blockInner,
	#wrapBlock4 .blockInner,
	#wrapBlock5 .blockInner { max-width: 500px; }
}



/* ――――――――――――――――――――――――――――――
［ blockTitle ］
―――――――――――――――――――――――――――――― */

.block1Title,
.block2Title,
.block3Title,
.block4Title { background: no-repeat left top; background-size: 100% auto; font-size: 0; line-height: 0; padding-top: calc( 155 / 900 * 100% ); margin-bottom: 30px; }
.block1Title { background-image: url(../images/block1_title1.png) ; }
.block2Title { background-image: url(../images/block2_title1.png) ; }
.block3Title { background-image: url(../images/block3_title1.png) ; }
.block4Title { background-image: url(../images/block4_title1.png) ; }

@media screen and (max-width: 767px) {
	.block1Title,
	.block2Title,
	.block3Title,
	.block4Title { padding-top: calc( 115 / 280 * 100% ); margin-bottom: 20px; }
	.block1Title { background-image: url(../images/block1_title2.png) ; }
	.block2Title { background-image: url(../images/block2_title2.png) ; }
	.block3Title { background-image: url(../images/block3_title2.png) ; }
	.block4Title { background-image: url(../images/block4_title2.png) ; }
}



/* ――――――――――――――――――――――――――――――
［ blockQa ］
―――――――――――――――――――――――――――――― */

.blockQa { margin-bottom: 30px; }
.blockQa dl { overflow: hidden; }
.blockQa dl dt { float: left; width: 55px; height: 55px; border-radius: 50%; font-size: 3.4rem; line-height: 5.5rem; color: #ffffff; font-weight: 700; text-align: center; }
.blockQa dl dd { float: right; width: calc( 100% - 66px ); font-size: 3.4rem; line-height: 4.4rem; font-weight: 700; font-feature-settings: "palt"; padding-top: 6px; }
.blockQa dl:nth-child(1) { margin-bottom: 15px; }
.blockQa dl:nth-child(1) dt { background-color: #ff5564; }
.blockQa dl:nth-child(1) dd { color: #ff5564; }
.blockQa dl:nth-child(2) dt { background-color: #1e78f0; }

@media screen and (max-width: 767px) {
	.blockQa { margin-bottom: 15px; }
	.blockQa dl dt { width: 40px; height: 40px; font-size: 2.4rem; line-height: 4rem; }
	.blockQa dl dd { width: calc( 100% - 50px ); font-size: 2.2rem; line-height: 3.2rem; padding-top: 5px; }
	.blockQa dl:nth-child(1) { margin-bottom: 10px; }
}



/* ――――――――――――――――――――――――――――――
［ blockMain ］
―――――――――――――――――――――――――――――― */

.blockMain { overflow: hidden; }
.blockMain p { font-size: 1.8rem; line-height: 3.5rem; }
.blockMain .mainTxtL { float: left; width: calc( 460 / 900 * 100% ); }
.blockMain .mainTxtR { float: right; width: calc( 460 / 900 * 100% ); }
.blockMain .mainImgL { float: left; width: calc( 380 / 900 * 100% ); margin-top: 8px; }
.blockMain .mainImgR { float: right; width: calc( 380 / 900 * 100% ); margin-top: 8px; }
.blockMain .imgCaption { font-size: 1.4rem; line-height: 2rem; text-align: center; font-feature-settings: "palt"; margin-top: 15px; }

@media screen and (max-width: 767px) {
	.blockMain p { font-size: 1.6rem; line-height: 3rem; }
	.blockMain .mainTxtL,
	.blockMain .mainTxtR { float: none; width: 100%; margin-bottom: 20px; }
	.blockMain .mainImgL,
	.blockMain .mainImgR { float: none; max-width: 380px; width: 100%; margin: 0 auto; }
}



/* ――――――――――――――――――――――――――――――
［ block2Img ］
―――――――――――――――――――――――――――――― */

.block2Img { overflow: hidden; max-width: 900px; margin-right: auto; margin-left: auto; }
.block2Img .imgBlock1,
.block2Img .imgBlock2 { width: calc( 432 / 900 * 100% ); background-color: #fff7f5; padding: 30px 20px 20px; }
.block2Img .imgBlock1 { float: left; }
.block2Img .imgBlock2 { float: right; }

@media screen and (max-width: 767px) {
	.block2Img { max-width: 500px; }
	.block2Img .imgBlock1,
	.block2Img .imgBlock2 { float: none; width: calc( 343 / 500 * 100% ); background-color: transparent; padding: 0; margin-right: auto; margin-left: auto; }
	.block2Img .imgBlock1 { margin-bottom: 40px; }
}


/* ――――――――――――――――――――――――――――――
［ block4Img1 ］
―――――――――――――――――――――――――――――― */

.block4Img1 { width: 860px; font-size: 0; line-height: 0; margin-right: auto; margin-left: auto; }
.block4Img1 .imgList { display: inline-block; vertical-align: top; }
.block4Img1 .imgList:not(:last-child) { position: relative; width: 230px; padding-right: 60px; }
.block4Img1 .imgList:last-child { width: 170px; }
.block4Img1 .imgList:not(:last-child)::after { position: absolute; top: 70px; right: 20px; display: block; width: 0; height: 0; border-style: solid; border-width: 15px 0 15px 16px; border-color: transparent transparent transparent #ff5563; content: ""; }
.block4Img1 .imgList .listImg { margin-bottom: 15px; }
.block4Img1 .imgList .listTxt { font-size: 1.5rem; line-height: 2.2rem; font-feature-settings: "palt"; }

@media screen and (max-width: 960px) {
	.block4Img1 { width: 240px; }
	.block4Img1 .imgList:not(:last-child) { width: 100%; padding-right: 0; padding-bottom: 60px; }
	.block4Img1 .imgList:last-child { width: 100%; }
	.block4Img1 .imgList:not(:last-child)::after { top: auto; right: 0; bottom: 20px; left: 0; border-width: 16px 15px 0 15px; border-color: #ff5563 transparent transparent transparent; margin-right: auto; margin-left: auto; }
	.block4Img1 .imgList .listImg { width: 170px; margin-right: auto; margin-left: auto; }
}



/* ――――――――――――――――――――――――――――――
［ block5Frame ］
―――――――――――――――――――――――――――――― */

.block5Frame { background: linear-gradient(#1eb4f0, #cffafb); padding: 20px; margin-bottom: 100px; }
.block5Frame .frameInner { background-color: #ffffff; padding: 55px calc( 70 / 960 * 100% ) 75px; }
.block5Frame .frameTitle { width: 470px; background-color: #1eb4f0; font-size: 3.4rem; line-height: 4.4rem; color: #ffffff; font-weight: 700; text-align: center; padding: 3px 10px; margin: 0 auto 20px; }
.block5Frame .frameCopy { font-size: 5.2rem; line-height: 6.2rem; font-weight: 700; text-align: center; margin-bottom: 35px; }
.block5Frame .frameMain { overflow: hidden; margin-bottom: 70px; }
.block5Frame .frameMain .mainImg { float: right; width: calc( 420 / 820 * 100% ); margin-bottom: 25px; margin-left: 40px; }
.block5Frame .frameMain p { font-size: 1.8rem; line-height: 3.5rem; font-feature-settings: "palt"; }
.block5Frame .frameItem { font-feature-settings: "palt"; margin-bottom: 40px; }
.block5Frame .frameItem .itemTitle { font-size: 2.6rem; line-height: 3.6rem; font-weight: 700; text-align: center; margin-bottom: 25px; }
.block5Frame .frameItem .itemList { font-size: 0; line-height: 0; }
.block5Frame .frameItem .itemList ul { display: inline-block; text-align: center; }
.block5Frame .frameItem .itemList ul li { display: inline-block; margin: 8px; }
.block5Frame .frameItem .itemList ul li:not(:last-child) { min-width: 160px; height: 60px; background-color: #1eb4f0; border-radius: 30px; font-size: 2.5rem; line-height: 4rem; color: #ffffff; font-weight: 700; text-align: center; padding: 10px 20px; }
.block5Frame .frameItem .itemList ul li:last-child { font-size: 2.6rem; line-height: 3.6rem; font-weight: 700; }
.block5Frame .frameBiography .biographyTitle { font-size: 1.8rem; line-height: 3.5rem; padding-left: 16px; }
.block5Frame .frameBiography .biographyInner { overflow: hidden; font-feature-settings: "palt"; }
.block5Frame .frameBiography .biographyBlock { width: 395px; background-image: linear-gradient(180deg, #000000 1px, transparent 1px); background-size: 100% 3.5rem; font-size: 1.8rem; line-height: 3.5rem; }
.block5Frame .frameBiography .biographyBlock:nth-child(1) { float: left; }
.block5Frame .frameBiography .biographyBlock:nth-child(2) { float: right; }
.block5Frame .frameBiography .biographyBlock dl { display: table; }
.block5Frame .frameBiography .biographyBlock dl dt { display: table-cell; white-space: nowrap; padding-right: 10px; padding-left: 16px; }
.block5Frame .frameBiography .biographyBlock dl dd { display: table-cell; }

@media screen and (max-width: 1110px) {
	.block5Frame .frameBiography .biographyBlock { width: 100%; }
	.block5Frame .frameBiography .biographyBlock:nth-child(1) { float: none; }
	.block5Frame .frameBiography .biographyBlock:nth-child(2) { float: none; }
	.block5Frame .frameBiography .biographyBlock br { display: none; }
}

@media screen and (max-width: 767px) {
	.block5Frame { padding: 10px; margin-bottom: 60px; }
	.block5Frame .frameInner { padding: 30px calc( 20 / 280 * 100% ) 35px; }
	.block5Frame .frameTitle { width: 100%; font-size: 2.4rem; line-height: 3rem; padding: 8px; }
	.block5Frame .frameCopy { font-size: 3rem; line-height: 4rem; margin-bottom: 20px; }
	.block5Frame .frameMain { margin-bottom: 40px; }
	.block5Frame .frameMain .mainImg { float: none; max-width: 420px; width: 100%; margin: 0 auto 20px; }
	.block5Frame .frameMain p { font-size: 1.6rem; line-height: 3rem; }
	.block5Frame .frameItem { margin-bottom: 30px; }
	.block5Frame .frameItem .itemTitle { font-size: 2.2rem; line-height: 3.2rem; margin-bottom: 15px; }
	.block5Frame .frameItem .itemList ul li { margin: 5px; }
	.block5Frame .frameItem .itemList ul li:not(:last-child) { min-width: 120px; height: 40px; border-radius: 20px; font-size: 1.6rem; line-height: 3rem; padding: 5px 10px; }
	.block5Frame .frameItem .itemList ul li:last-child { font-size: 1.8rem; line-height: 3rem; }
	.block5Frame .frameBiography .biographyTitle { font-size: 1.6rem; line-height: 3rem; padding-left: 8px; }
	.block5Frame .frameBiography .biographyBlock { background-size: 100% 3rem; font-size: 1.6rem; line-height: 3rem; }
	.block5Frame .frameBiography .biographyBlock dl dt { padding-left: 8px; }
}



/* ――――――――――――――――――――――――――――――
［ block5Banner ］
―――――――――――――――――――――――――――――― */

.block5Banner { max-width: 590px; margin-right: auto; margin-left: auto; }





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 pageTop 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.pageTop { position: fixed; right: calc(50% - 570px); z-index: 10000; }
.pageTop a { position: relative; overflow: hidden; display: block; width: 50px; height: 50px; background-color: #176683; border-radius: 50%; font-size: 0; line-height: 0; }
.pageTop a::before { position: absolute; top: -2px; right: 0; bottom: 0; left: 0; display: block; width: 22px; height: 12px; background: url(../images/pagetop.svg) no-repeat left top; background-size: cover; content: ""; margin: auto; }

@media screen and (max-width: 1240px) {
	.pageTop { right: calc( 50 / 1240 * 100% ); }
}

@media screen and (min-width: 769px) {
	.pageTop a { transition: 0.3s ease; }
	.pageTop a:hover { background-color: #58a9c7; }
}

@media screen and (max-width: 767px) {
	.pageTop { position: static !important; right: 0; left: 0; }
	.pageTop a { margin: 0 auto 20px; }
}
