@charset "UTF-8";
/**************************************
							共 通 項 目
**************************************/
html { background: #FEFEFE; }

.wrapper { width: 100%; max-width: 1920px; margin: auto; padding: 0; font-size: 0; background-color: #FEFEFE; overflow-x: hidden; }

hr { border: none; border-bottom: solid 1px #CCC; }

.shadow-bk { text-shadow: 2px  2px 1px #000000,-2px  2px 1px #000000,2px -2px 1px #000000,-2px -2px 1px #000000,2px  0px 1px #000000,0px  2px 1px #000000,-2px  0px 1px #000000,0px -2px 1px #000000; }

.shadow-wh { text-shadow: 2px  2px 1px #FEFEFE,-2px  2px 1px #FEFEFE,2px -2px 1px #FEFEFE,-2px -2px 1px #FEFEFE,2px  0px 1px #FEFEFE,0px  2px 1px #FEFEFE,-2px  0px 1px #FEFEFE,0px -2px 1px #FEFEFE; }

/**************************************
						コ ン テ ン ツ
**************************************/
.title { background-color: #FDD23E; padding: 0.25rem 0.5rem; position: relative; height: 1.5rem; width: 29.0rem; margin-top: 6.0rem; }
.title h1 { font-size: 2.8rem; font-weight: 700; position: absolute; bottom: 0; }
.title h1 span { font-size: 1.4rem; font-weight: 500; }

h2.intro { font-size: 1.4rem; line-height: 2.2rem; font-weight: 500; }
@media (min-width: 576px) { h2.intro { font-size: 1.6rem; line-height: 2.7rem; } }

h3.text { font-size: 1.4rem; font-weight: 700; }

p.text { font-size: 1.0rem; font-weight: 400; line-height: 1.6rem; }

p.sup { font-size: 0.8rem; font-weight: 400; text-align: center; line-height: 0.9rem; }
p.sup span { font-size: 1.2rem; font-weight: 500; line-height: 1.8rem; }

.takahashi { width: 100%; max-width: 200px; }
@media (min-width: 768px) { .takahashi { max-width: 100%; } }

.profile { background-color: #F5F2E9; }
.profile h3 { font-family: "futura-pt",'Roboto', 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif; font-weight: 300; font-style: italic; font-size: 4.0rem; width: 100%; }
.profile h4 { font-size: 1.6rem; font-weight: 700; }
.profile p.text { line-height: 1.5rem; }

.staff-select h3 { font-size: 2.0rem; }
.staff-select .model { padding: 1.25rem; }
.staff-select .model h4 { font-size: 1.2rem; font-weight: 700; text-align: center; line-height: 1.6rem; height: 3.6rem; display: flex; align-items: center; justify-content: center; }
.staff-select .model p.comment { font-size: 0.9rem; font-weight: 400; }

.sakura-comment .image-area { position: relative; background-color: #F6BCB8; width: 90%; }
.sakura-comment .image-area img { width: 105%; transform: translate(1.5rem, 1.5rem); }
@media (min-width: 992px) { .sakura-comment .image-area { width: 100%; } }

.sakura-comment .comment-area h4 { font-size: 1.9rem; font-weight: 500; }
@media (min-width: 992px) { .sakura-comment .comment-area { padding-left: 4.0rem; padding-top: 1.5rem; } }

.select-item { background-color: #F5F2E9; }
.select-item .model-name { display: flex; flex-wrap: wrap; align-items: center; }
.select-item .model-name .rank { font-family: "futura-pt",'Roboto', 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif; font-weight: 700; font-style: italic; font-size: 4.0rem; color: #FEFEFE; }
.select-item .model-name .rank span { font-size: 8.0rem; }
.select-item .model-name .rank.no1 { background: url("../img/no1.svg") left/contain no-repeat; height: 10.0rem; }
.select-item .model-name .rank.no2 { background: url("../img/no2.svg") left/contain no-repeat; height: 10.0rem; }
.select-item .model-name .rank.no3 { background: url("../img/no3.svg") left/contain no-repeat; height: 10.0rem; }
.select-item .model-name .rank .no4 { width: 12.0rem; margin-bottom: -3.0rem; }
.select-item .model-name h3 { font-size: 4.3rem; line-height: 4.3rem; font-style: italic; font-weight: 700; }
.select-item h4 { background-color: #FDD23E; padding: 0.25rem 0.5rem; position: relative; height: 1.25rem; width: 30.0rem; }
.select-item h4 span { font-size: 1.6rem; font-weight: 700; display: block; position: absolute; bottom: 0.25rem; left: 0; width: 100%; height: 2.0rem; text-align: center; }
.select-item p.text { font-size: 1.2rem; line-height: 2.0rem; }
.select-item .image-area { position: relative; background-color: #F6BCB8; width: calc(100% - 1.5rem); margin-left: 1.5rem; margin-top: 3.0rem; margin-bottom: 3.0rem; }
.select-item .image-area img { width: 100%; transform: translate(-1.5rem, -1.5rem); }
@media (min-width: 992px) { .select-item .image-area { width: 70%; margin-left: auto; margin-right: auto; } }
.select-item h5 { font-family: "bc-alphapipe","futura-pt",'Roboto', 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif; font-size: 2.9rem; font-weight: 400; position: relative; padding-left: 6.0rem; }
.select-item h5::before { content: ""; width: 5.0rem; height: 5.0rem; position: absolute; top: 50%; left: 0; transform: translateY(-50%); background: url("../img/takahashi.png") center/contain no-repeat; }
.select-item p.staff-comment { font-size: 1.0rem; font-weight: 300; line-height: 1.6rem; margin-top: 1.5rem; }
.select-item hr { border: none; border-bottom: dashed 2px #A96B41; }
.select-item h2 { font-size: 1.8rem; line-height: 3.0rem; font-weight: 700; }
@media (min-width: 768px) { .select-item h2 { text-align: center; } }
.select-item .btn { width: 100%; border-radius: 1.5rem; border: solid 2px #A96B41; color: #A96B41; font-size: 1.4rem; font-weight: 500; line-height: 3.0rem; position: relative; transition: .8s; text-align: center; }
.select-item .btn a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; text-indent: -9999px; }
.select-item .btn:hover { background-color: #A96B41; color: #FEFEFE; }

.cd { background-color: #F5F2E9; }
.cd h4 { font-size: 1.6rem; font-weight: 700; }
.cd h4 span { font-size: 1.0rem; font-weight: 500; }
.cd p.sup { text-align: left; word-break: break-all; line-height: 1.2rem; }

.footer { background-color: #000; width: 100%; margin: 0; padding: 0; text-align: center; }

.footer img { width: 60%; max-width: 300px; }

.copy { font-size: 0.6rem; text-align: center; padding: 0; line-height: 2.6rem; color: #FEFEFE; }

/***************************************************************
										ス ラ イ ダ ー
****************************************************************/
.slick { position: relative; width: 90%; margin: auto; }
@media (min-width: 1200px) { .slick { width: 100%; } }

.slide-arrow { width: 2.0rem; height: 2.0rem; display: block; opacity: 0.2; transition: .4s; }
.slide-arrow:hover { cursor: pointer; opacity: 1.0; }

.prev-arrow { position: absolute; top: 50%; left: -52%; transform: translateY(-50%); }

.next-arrow { position: absolute; top: 50%; right: -52%; transform: translateY(-50%); }
