@charset "utf-8";

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 汎用フォント関連 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.fwN { font-weight: 500; }
.fwB { font-weight: 700; }
.fcR { color: #cc0000; }
.tdL { text-decoration: line-through; }
.tdU { text-decoration: underline; }
.wsN { white-space: nowrap; }
.taR,.taRL,.taRC { text-align: right; }
.taC,.taCL { text-align: center; }

@media screen and (max-width: 767px) {
	.taRL,.taCL { text-align: left; }
	.taLC,.taRC { text-align: center; }
}



/* ――――――――――――――――――――――――――――――
［ font：文字サイズ個別指定 ］
―――――――――――――――――――――――――――――― */

.font14 { font-size: 1.4rem; line-height: 2.2rem; }
.font18 { font-size: 1.8rem; line-height: 3.2rem; }

@media screen and (max-width: 767px) {
	.font14 { font-size: 1.2rem; line-height: 2rem; }
	.font18 { font-size: 1.6rem; line-height: 2.8rem; }
}



/* ――――――――――――――――――――――――――――――
［ commonPara ］
―――――――――――――――――――――――――――――― */

.commonPara15 p:not(:last-child) { margin-bottom: 15px; }
.commonPara20 p:not(:last-child) { margin-bottom: 20px; }
.commonPara25 p:not(:last-child) { margin-bottom: 25px; }
.commonPara30 p:not(:last-child) { margin-bottom: 30px; }
.commonPara35 p:not(:last-child) { margin-bottom: 35px; }
.commonPara40 p:not(:last-child) { margin-bottom: 40px; }

@media screen and (max-width: 767px) {
	.commonPara15 p:not(:last-child) { margin-bottom: 10px; }
	.commonPara20 p:not(:last-child) { margin-bottom: 10px; }
	.commonPara25 p:not(:last-child) { margin-bottom: 12px; }
	.commonPara30 p:not(:last-child) { margin-bottom: 15px; }
	.commonPara35 p:not(:last-child) { margin-bottom: 18px; }
	.commonPara40 p:not(:last-child) { margin-bottom: 20px; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 汎用レイアウト関連 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* ――――――――――――――――――――――――――――――
［ diB：各種 display inline-block ］
―――――――――――――――――――――――――――――― */

.diIB { display: inline; }
.diB  { display: inline-block; }
.diBI { display: inline-block; }
.diBB { display: inline-block; }
.dbI  { display: block; }
.dbIB { display: block; }

@media screen and (max-width: 767px) {
	.diIB { display: inline-block; }
	.diB  { display: inline-block; }
	.diBI { display: inline; }
	.diBB { display: block; }
	.dbI  { display: inline; }
	.dbIB { display: inline-block; }
}



/* ――――――――――――――――――――――――――――――
［ 汎用左右レイアウト ］
―――――――――――――――――――――――――――――― */

.flL { float: left; }
.flR { float: right; }
.ofHR340 { overflow: hidden; }
.ofHR340 .flL { width: calc( 480 / 890 * 100% ); }
.ofHR340 .flR { width: calc( 340 / 890 * 100% ); padding-top: 5px; }

@media screen and (max-width: 767px) {
	.flL,.flR { float: none; }
	.ofHR340 .flL { width: 100%; margin-bottom: 30px; }
	.ofHR340 .flR { max-width: 340px; width: 100%; padding-top: 0; margin-right: auto; margin-left: auto; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 main 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.mainTitle { overflow: hidden; background-image: url(../images/main_title1.jpg); background-size: cover; font-size: 0; line-height: 0; border-radius: 20px; padding-top: calc( 420 / 890 * 100% ); margin-bottom: 5px; }
.mainLead { font-size: 2rem; line-height: 3.6rem; font-weight: 700; text-align: center; margin-bottom: 50px; }

@media screen and (max-width: 767px) {
	.mainTitle { background-image: url(../images/main_title2.jpg); border-radius: 0; padding-top: calc( 490 / 320 * 100% ); }
	.mainLead { font-size: 1.6rem; line-height: 2.8rem; text-align: left; margin-bottom: 30px; }
}

@media screen and (max-width: 450px) {
	.mainWrap { margin-right: calc( 15 / 320 * 100% ); margin-left: calc( 15 / 320 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 menuAnchor 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

.menuAnchor { font-size: 0; line-height: 0; margin-bottom: 46px; }
.menuAnchor a { position: relative; display: inline-block; width: calc( 280 / 890 * 100% );  padding-bottom: 30px; }
.menuAnchor a:nth-child(2) { margin-right: calc( 25 / 890 * 100% ); margin-left: calc( 25 / 890 * 100% ); }
.menuAnchor a::before,
.menuAnchor a::after { position: absolute; right: 0; left: 0; display: block; content: ""; margin-right: auto; margin-left: auto; }
.menuAnchor a::before { bottom: 6px; width: 45px; height: 45px; background-color: #ffffff; border: solid 2px #333333; border-radius: 50%; }
.menuAnchor a::after { bottom: 26px; width: 15px; height: 15px; border: solid #333333; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.menuAnchor a span { display: block; background-size: cover; border-radius: 8px; padding-top: calc( 470 / 280 * 100% );}
.menuAnchor a:nth-child(1) span { background-image: url(../images/menu_anchor1.gif); }
.menuAnchor a:nth-child(2) span { background-image: url(../images/menu_anchor2.gif); }
.menuAnchor a:nth-child(3) span { background-image: url(../images/menu_anchor3.gif); }

@media screen and (min-width: 769px) {
	.menuAnchor a::before,
	.menuAnchor a::after { transition: 0.2s ease; }
	.menuAnchor a:hover::before { bottom: -24px; }
	.menuAnchor a:hover::after { bottom: -4px; }
}

@media screen and (max-width: 767px) {
	.menuAnchor { width: 240px; margin: 0 auto 30px; }
	.menuAnchor a { display: block; width: 100%; padding-bottom: 30px; }
	.menuAnchor a:nth-child(2) { margin: 20px 0; }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 section 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* ――――――――――――――――――――――――――――――
［ sectionTitle ］
―――――――――――――――――――――――――――――― */

.sectionTitle { font-weight: 700; padding: 45px 30px 35px; margin-bottom: 35px; }
.sectionTitle .titlePart { display: inline-block; width: 120px; background-color: #ffffff; border-radius: 50vh; font-size: 2rem; line-height: 3rem; text-align: center; margin-bottom: 5px; }
.sectionTitle .titleMain { font-size: 3rem; line-height: 5rem; color: #ffffff; }
	#part1 .sectionTitle { background-color: #f0c941; }
	#part2 .sectionTitle { background-color: #5fc14e; }
	#part3 .sectionTitle { background-color: #36aed1; }
	#part1 .sectionTitle .titlePart { color: #da7e25; }
	#part2 .sectionTitle .titlePart { color: #2ba02e; }
	#part3 .sectionTitle .titlePart { color: #12a0c8; }

@media screen and (max-width: 767px) {
	.sectionTitle { padding: 25px 20px 20px; margin-bottom: 25px; }
	.sectionTitle .titlePart { width: 100px; font-size: 1.4rem; line-height: 2.4rem; margin-bottom: 10px; }
	.sectionTitle .titleMain { font-size: 2rem; line-height: 2.6rem; }
}



/* ――――――――――――――――――――――――――――――
［ sectionTheme ］
―――――――――――――――――――――――――――――― */

.sectionTheme { border-bottom: solid 2px; font-size: 2.6rem; line-height: 3.6rem; font-weight: 700; padding-bottom: 14px; margin-bottom: 25px; }
	#part1 .sectionTheme { border-color: #da7e25; color: #da7e25; }
	#part2 .sectionTheme { border-color: #2ba02e; color: #2ba02e; }
	#part3 .sectionTheme { border-color: #47b7d7; color: #47b7d7; }

@media screen and (max-width: 767px) {
	.sectionTheme { font-size: 2rem; line-height: 3rem; padding-bottom: 10px; margin-bottom: 20px; }
}



/* ――――――――――――――――――――――――――――――
［ sectionAnn ］
―――――――――――――――――――――――――――――― */

.sectionAnn  { border: solid #cccccc; border-width: 1px 0; padding-top: 13px; padding-bottom: 13px; }
.sectionAnn dl { display: table; }
.sectionAnn dl:not(:last-child) { margin-bottom: 13px; }
.sectionAnn dl dt { display: table-cell; font-weight: 700; }
.sectionAnn dl dd { display: table-cell; }



/* ――――――――――――――――――――――――――――――
［ sectionComment ］
―――――――――――――――――――――――――――――― */

.sectionComment { overflow: hidden; }
.sectionComment .commentPortrait { float: left; width: 80px; }
.sectionComment .commentPortrait .portraitImg { overflow: hidden; border: solid 1px #cccccc; border-radius: 50%; }
.sectionComment .commentPortrait .portraitName { font-size: 1.4rem; line-height: 2rem; text-align: center; }
.sectionComment .commentSb { float: right; position: relative; width: calc( 100% - 120px ); border-radius: 20px; padding: 23px 30px; }
.sectionComment .commentSb::before { position: absolute; top: 32px; left: -24px; display: block; width: 0; height: 0; border-style: solid; border-width: 7px 24px 7px 0; content: ""; }

#part1 .sectionComment .commentSb { background-color: #fef5b0; }
#part1 .sectionComment .commentSb::before { border-color: transparent #fef5b0 transparent transparent; }
#part1 .sectionComment .commentLine { background: linear-gradient(to top,#f7a4a4 0px,#f7a4a4 .4em,#fef5b0 .4em); }
#part2 .sectionComment .commentSb { background-color: #d9fbd4; }
#part2 .sectionComment .commentSb::before { border-color: transparent #d9fbd4 transparent transparent; }
#part2 .sectionComment .commentLine { background: linear-gradient(to top,#f7a4a4 0px,#f7a4a4 .4em,#d9fbd4 .4em); }
#part3 .sectionComment .commentSb { background-color: #d3eff7; }
#part3 .sectionComment .commentSb::before { border-color: transparent #d3eff7 transparent transparent; }
#part3 .sectionComment .commentLine { background: linear-gradient(to top,#f7a4a4 0px,#f7a4a4 .4em,#d3eff7 .4em); }

@media screen and (max-width: 767px) {
	.sectionComment .commentPortrait { width: 60px; }
	.sectionComment .commentPortrait .portraitName { font-size: 1.2rem; }
	.sectionComment .commentSb { width: calc( 100% - 90px ); border-radius: 10px; padding: 10px 15px; }
	.sectionComment .commentSb::before { top: 23px; left: -20px; border-width: 7px 20px 7px 0; }
}



/* ――――――――――――――――――――――――――――――
［ sectionImg ］
―――――――――――――――――――――――――――――― */

.p1s2t1 { display: block; background-image: url(../images/part1_sc2_table1_1.gif); background-size: cover; font-size: 0; line-height: 0; padding-top: calc( 293 / 830 * 100% ); }
.p3s2i1 { display: block; background-image: url(../images/part3_sc2_img1_1.gif); background-size: cover; font-size: 0; line-height: 0; padding-top: calc( 480 / 890 * 100% ); }

@media screen and (max-width: 767px) {
	.p1s2t1 { background-image: url(../images/part1_sc2_table1_2.gif); padding-top: calc( 437 / 290 * 100% ); }
	.p3s2i1 { background-image: url(../images/part3_sc2_img1_2.gif); padding-top: calc( 505 / 320 * 100% ); }
}



/* ――――――――――――――――――――――――――――――
［ contentsBanner ］
―――――――――――――――――――――――――――――― */

.contentsBanner { font-size: 0; line-height: 0; }
.contentsBanner a { display: block; background-image: url(../images/banner1.jpg); background-size: cover; padding-top: calc( 230 / 890 * 100% ); }

@media screen and (max-width: 767px) {
	.contentsBanner a { background-image: url(../images/banner2.jpg); padding-top: calc( 310 / 320 * 100% ); }
}





/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
【 コンテンツ間隔 】
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

/* ――――――――――――――――――――――――――――――
［ margin-bottom ］
―――――――――――――――――――――――――――――― */

.mb05 { margin-bottom: 5px; }
.mb06 { margin-bottom: 6px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb35 { margin-bottom: 35px; }
.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; }
	.mb25 { margin-bottom: 15px; }
	.mb30 { margin-bottom: 20px; }
	.mb35 { margin-bottom: 20px; }
	.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; }
}



/* ――――――――――――――――――――――――――――――
［ sectionMargin ］
―――――――――――――――――――――――――――――― */

.sectionMargin30 section:not(:last-child) { margin-bottom: 30px; }
.sectionMargin40 section:not(:last-child) { margin-bottom: 40px; }
.sectionMargin50 section:not(:last-child) { margin-bottom: 50px; }
.sectionMargin60 section:not(:last-child) { margin-bottom: 60px; }
.sectionMargin70 section:not(:last-child) { margin-bottom: 70px; }
.sectionMargin80 section:not(:last-child) { margin-bottom: 80px; }
.sectionMargin90 section:not(:last-child) { margin-bottom: 90px; }
.sectionMargin100 section:not(:last-child) { margin-bottom: 100px; }
.sectionMargin120 section:not(:last-child) { margin-bottom: 120px; }

@media screen and (max-width: 767px) {
	.sectionMargin30 section:not(:last-child) { margin-bottom: 20px; }
	.sectionMargin40 section:not(:last-child) { margin-bottom: 20px; }
	.sectionMargin50 section:not(:last-child) { margin-bottom: 25px; }
	.sectionMargin60 section:not(:last-child) { margin-bottom: 30px; }
	.sectionMargin70 section:not(:last-child) { margin-bottom: 35px; }
	.sectionMargin80 section:not(:last-child) { margin-bottom: 40px; }
	.sectionMargin90 section:not(:last-child) { margin-bottom: 45px; }
	.sectionMargin100 section:not(:last-child) { margin-bottom: 50px; }
	.sectionMargin120 section:not(:last-child) { margin-bottom: 60px; }
}
