@charset "utf-8";

/* 基礎レイアウト
========================================================= */

img { width: 100%; height: auto; vertical-align: top; }

#contentsheader { overflow: hidden; display: block; width: 100%; height: 360px; background-repeat: no-repeat; background-position: center center; background-size: cover; text-align: center; }
#contentsheader p.icon { width: 55px; height: 55px; background: url(/images/h1_special2_icon.svg) no-repeat left top; margin: 120px auto 25px; }
#contentsheader h1 { color: #ffffff; font-size: 48px; margin-right: auto; margin-left: auto; }

@media screen and (max-width: 1199px) {
	#contentsheader { height: 320px; }
	#contentsheader p.icon { margin-top: 100px; }
}

@media screen and (max-width: 992px) {
	#contentsheader { height: 280px; }
	#contentsheader p.icon { margin-top: 80px; }
}

@media screen and (max-width: 768px) {
	#contentsheader { height: 240px; }
	#contentsheader p.icon { width: 44px; height: 44px; margin-top: 60px; margin-bottom: 22px; }
	#contentsheader h1 { font-size: 36px; }
}

@media screen and (max-width: 480px) {
	#contentsheader { height: 160px; }
	#contentsheader p.icon { width: 33px; height: 33px; margin-top: 40px; margin-bottom: 16px; }
	#contentsheader h1 { font-size: 24px; }
}



/* 共通レイアウトスタイル
========================================================= */

#photoMain { margin-bottom: 30px; }
#photoMain .mainInnner { margin-bottom: 7px; }

#photoMain p { font-size: 17px; line-height: 30px; text-align: center; }
#snsArea { margin-bottom: 55px; }
#photoNav { width: 1100px; margin-right: auto; margin-bottom: -65px; margin-left: auto; }
#photoContnt .contentInnner { width: 1100px; margin-right: auto; margin-left: auto; }

.pcView { display: block; }
.spView { display: none; }


@media screen and (max-width: 1199px) {
	#photoMain .mainInnner .mainTitle { width: 100%; }
	#photoMain p { width: 95%; margin: 0 auto; }
}

@media screen and (max-width: 768px) {
	#photoNav { margin-bottom: -40px; }
	#photoContnt { padding-top: 90px; padding-bottom: 60px; }
	#photoMain .mainInnner .mainTitle { min-width: 200px; }
	.pcView { display: none; }
	.spView { display: block; }
}

@media screen and (max-width: 767px) {
	#photoMain .mainInnner { background: none; }
	#photoMain .mainInnner .mainTitle { max-width: 100%; width: 100%;  margin: 0 auto; padding: 0; }
	#photoMain .mainInnner .mainTitle img:nth-child(1) { display: none; }
	#photoMain .mainInnner .mainTitle img:nth-child(2) { display: block; }

	#photoMain p { font-size: 14px; line-height: 22px; text-align: left; }
	#photoMain p br { display: none; }
	#photoNav { margin-bottom: -33px; }
}



/* 汎用パーツ
========================================================= */

/* pageNav
------------------------------------------ */

.pageNav { overflow: hidden; width: 100%; font-size: 36px; line-height: 46px; font-weight: bold; text-align: center; }
.pageNav div:nth-child(1),.pageNav a:nth-child(1) { float: left; }
.pageNav div:nth-child(2),.pageNav a:nth-child(2) { float: right; }
.pageNav div,.pageNav a { width: 49.09090909090909%; box-sizing: border-box; border: solid 5px #449ec4; border-radius: 65px; padding: 40px 40px 34px; }
.pageNav div { background-color: #449ec4; color: #ffde00; }
.pageNav a { display: block; background-color: #ffffff; color: #c3c3c3; text-decoration: none; }

@media screen and (max-width: 1100px) {
	.pageNav { font-size: 26px; line-height: 36px; }
}

@media screen and (min-width: 769px) {
	.pageNav a:hover { background-color: #449ec4; color: #ffde00; }
}

@media screen and (max-width: 768px) {
	.pageNav { font-size: 20px; line-height: 30px; }
	.pageNav div,.pageNav a { border-width: 4px; padding: 20px; }
}

@media screen and (max-width: 767px) {
	.pageNav { font-size: 18px; line-height: 28px; }
	.pageNav div { display: none; }
	.pageNav a { position: relative; width: 100%; border-width: 3px; color: #449ec4; padding: 15px; }
	.pageNav a:after { position: absolute; top: 21px; right: 20px; display: block; width: 10px; height: 10px; border-right: solid 3px #449ec4; border-bottom: solid 3px #449ec4; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
}


/* btnType
------------------------------------------ */

.btnType1 { margin-top: 30px; }
.btnType2 { margin-top: 15px; }
.btnType1 a,
.btnType2 a { display: inline-block; background-color: #333333; border-radius: 5px; font-size: 15px; line-height: 24px; color: #ffffff; text-decoration: none; padding: 7px 35px 6px; }
.btnType1 a:hover { background-color: #ef5f4c; }
.btnType2 a:hover { background-color: #ffffff; color: #ef5f4c; }

@media screen and (max-width: 768px) {
	.btnType1 a,
	.btnType2 a { padding-bottom: 7px; }
}

@media screen and (max-width: 767px) {
	.btnType1 { text-align: center; margin-top: 20px; }
	.btnType2 { text-align: center; }
}



/* 専用パーツ1P
========================================================= */

#bgWrapper { background: url(images/special/07/img_bg.gif) repeat-y; width: 100%; margin: 0 auto; background-size: contain; }
#special07 { max-width: 1100px; margin: 0 auto; width: 100%; }
#photoMain { max-width: 1500px; width: 100%; margin: 0 auto; }
#specialMain { max-width: 1140px; width: 100%; margin: 0 auto; box-sizing: border-box; padding: 0 20px; }
#specialMain .specialNav { margin-bottom: 50px; }
#specialMain .specialNav ul { display: -webkit-flex; display: flex; justify-content: center; }
#specialMain .specialNav ul li { display: -webkit-flex; display: flex; align-items: center; width: 19.272%; background: #fff; overflow: hidden; border-radius: 12px; }
#specialMain .specialNav ul li + li { margin-left: 0.90909%; }
#specialMain .specialNav ul li a { display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; text-align: center; font-size: 1.14em; line-height: 1.375; padding: 9px 30px 7px ; text-decoration: none; }
#specialMain .specialNav ul li a:hover { opacity: .5; }
#specialMain .specialNav ul li.navShinjuku a { color: #b376be; }
#specialMain .specialNav ul li.navYotsuya a { color: #e5992d; }
#specialMain .specialNav ul li.navKagurazaka a { color: #f15757; }
#specialMain .specialNav ul li.navOokubo a { color: #85c639; }
#specialMain .specialNav ul li.navOchiai a { color: #49b8dc; }

#specialMain .specialContent { padding-bottom: 90px; }
#specialMain .specialContent section { padding-top: 140px; margin-top: -140px; }
#specialMain .specialContent section + section { margin-top: -65px; }
#specialMain .specialContent section h2 { font-size: 1.71em; line-height: 1.25; margin-bottom: 15px; font-weight: bold; text-align: center; }
#specialMain .specialContent section .specialList { background: #fff; background-color: rgba( 255,255,255,.5); padding: 90px; }
#specialMain .specialContent section .specialList h3 { font-size: 2.57em; line-height: 1.33; font-weight: bold; }
section#spShinjuku .specialList h3 { color: #b376be; }
section#spYotsuya .specialList h3 { color: #e5992d; }
section#spKagurazaka .specialList h3 { color: #f15757; }
section#spOokubo .specialList h3 { color: #85c639; }
section#spOchiai .specialList h3 { color: #49b8dc; }

#specialMain .specialContent section .specialList .specialEx { display: -webkit-flex; display: flex; }
#specialMain .specialContent section .specialList .specialEx .specialInfo { max-width: 500px; min-width: 280px; }
#specialMain .specialContent section .specialList .specialEx figure { max-width: 380px; margin-left: 40px; }
#specialMain .specialContent section .specialList .specialEx h4 { font-size: 1.57em; line-height: 1.33; font-weight: bold; margin: 20px 0 10px; }
#specialMain .specialContent section .specialList .specialEx p { font-size: 1.07em; line-height: 1.866; }
#specialMain .specialContent section .specialList .specialEx h5 { display: inline-block; font-size: 0.93em; color: #fff; margin-top: 20px; padding: 5px 24px 4px; line-height: 1; }

section#spShinjuku .specialList h5 { background: #b376be; }
section#spYotsuya .specialList h5 { background: #e5992d; }
section#spKagurazaka .specialList h5 { background: #f15757; }
section#spOokubo .specialList h5 { background: #85c639; }
section#spOchiai .specialList h5 { background: #49b8dc; }

#specialMain .specialContent section .specialList .specialEx table { width: 100%; font-size: 0.93em; text-align: left; }
#specialMain .specialContent section .specialList .specialEx table tr th { font-weight: bold; width: 5.5em; padding: 4px 0; }
#specialMain .specialContent section .specialList .specialEx table tr td { padding: 4px 0; }
#specialMain .specialContent section .specialList .specialEx table tr + tr th,
#specialMain .specialContent section .specialList .specialEx table tr + tr td { border-top: 1px solid #d1d7da; }
#specialMain .specialContent section .specialList .specialSubImg { margin-top: 30px; }
#specialMain .specialContent section .specialList .specialSubImg .smallImg { display: -webkit-flex; display: flex; margin-top: 20px; }
#specialMain .specialContent section .specialList .specialSubImg .smallImg figure { width: calc(50% - 10px); }
#specialMain .specialContent section .specialList .specialSubImg .smallImg figure + figure { padding-left: 20px; }

#specialMain .specialContent section .specialList .specialInquiry { margin-top: 60px; border: 5px solid #d1d7da; padding: 27px 35px 25px; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryTitle { font-size: 1.14em; font-weight: bold; line-height: 1; margin-bottom: 8px; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryList { display: -webkit-flex; display: flex; justify-content: space-between; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryList table { width: calc(50% - 20px); text-align: left; font-size: 0.92em; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr th { width: 5em; font-weight: bold; padding: 4px 0; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr td { padding: 4px 0; }
#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr + tr th,
#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr + tr td { border-top: 1px solid #d1d7da; }
#specialMain .specialContent section .specialList .specialInquiry .parts_button3 { margin: 20px auto 0; text-align: center; }


@media screen and (max-width: 1100px) {
	#specialMain .specialNav ul li a { font-size: 1em; padding: 11px 15px 9px ; }
	#specialMain .specialContent section .specialList { padding: 45px; }
	#specialMain .specialContent section .specialList h3 { font-size: 2.14em; line-height: 1.33; font-weight: bold; }
	#specialMain .specialContent section .specialList .specialEx .specialInfo { max-width: 590px; }
	#specialMain .specialContent section .specialList .specialEx h4 { font-size: 1.57em; font-weight: bold; margin: 20px 0 15px; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList { display: block; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table { width: 100%; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table + table th,
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table + table td { border-top: 1px solid #d1d7da; }
	#specialMain .specialContent section .specialList .specialInquiry .parts_button3 { margin: 25px auto 0; text-align: center; }
}
@media screen and (max-width: 767px) {
	#specialMain { margin: 0 auto; box-sizing: border-box; padding: 0 10px; }
	#specialMain .specialNav { margin-bottom: 50px; }
	#specialMain .specialNav ul { display: block; }
	#specialMain .specialNav ul li { width: 100%; border-radius: 0px; }
	#specialMain .specialNav ul li + li { margin: 5px 0 0; }
	#specialMain .specialNav ul li a { font-size: 1em; padding: 11px 10px 9px ; }

	#specialMain .specialContent { padding-bottom: 45px; }
	#specialMain .specialContent section { padding-top: 80px; margin-top: -80px; }
	#specialMain .specialContent section + section { margin-top: -45px; }
	#specialMain .specialContent section h2 { font-size: 1.28em; margin-bottom: 10px; }
	#specialMain .specialContent section .specialList { padding: 20px; }
	#specialMain .specialContent section .specialList h3 { font-size: 1.71em; }

	#specialMain .specialContent section .specialList .specialEx { display: block; }
	#specialMain .specialContent section .specialList .specialEx .specialInfo { max-width: 767px; width: 100%; min-width: 0; }
	#specialMain .specialContent section .specialList .specialEx figure { max-width: 7670px; width: 100%; margin: 20px 0 0; }
	#specialMain .specialContent section .specialList .specialEx h4 { font-size: 1.28em; margin: 10px 0; }
	#specialMain .specialContent section .specialList .specialEx p { font-size: 1em; line-height: 1.71; }
	#specialMain .specialContent section .specialList .specialEx h5 { margin-top: 20px; padding: 5px 10px; }
	#specialMain .specialContent section .specialList .specialSubImg { margin-top: 10px; }
	#specialMain .specialContent section .specialList .specialSubImg .smallImg { display: block; margin-top: 10px; }
	#specialMain .specialContent section .specialList .specialSubImg .smallImg figure { width: 100%; }
	#specialMain .specialContent section .specialList .specialSubImg .smallImg figure + figure { padding: 10px 0 0; }

	#specialMain .specialContent section .specialList .specialInquiry { margin-top: 30px; border: 3px solid #d1d7da; padding: 25px; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table { width: 100%; margin-right: 10px; font-size: 0.86em; line-height: 1.5; }
	#specialMain .specialContent section .specialList .specialInquiry .parts_button3 { margin: 10px auto 0; }
}



@media screen and (max-width: 414px) {
	#specialMain .specialContent section .specialList .specialInquiry { margin-top: 30px; border: 3px solid #d1d7da; padding: 20px 10px; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table { width: 100%; margin-right: 10px; font-size: 0.86em; line-height: 1.5; word-break: break-all; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr th { display: block; width: 100%; padding: 5px 0 0; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr td { display: block; width: 100%; border-top: 0; padding: 0 0 5px; }
	#specialMain .specialContent section .specialList .specialInquiry .inquiryList table tr + tr td { border-top: 0; }
	#specialMain .specialContent section .specialList .specialInquiry .parts_button3 { margin: 10px auto 0; }
}