@charset "UTF-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
button, hr, input { overflow: visible; }

progress, sub, sup { vertical-align: baseline; }

[type=checkbox], [type=radio], legend { box-sizing: border-box; padding: 0; }

html { line-height: 1.15; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

details, main { display: block; }

h1 { font-size: 2em; margin: .67em 0; }

hr { box-sizing: content-box; height: 0; }

code, kbd, pre, samp { font-family: monospace,monospace; font-size: 1em; }

a { background-color: transparent; }

abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; }

b, strong { font-weight: bolder; }

small { font-size: 80%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; }

sub { bottom: -.25em; }

sup { top: -.5em; }

img { border-style: none; }

button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; }

button, select { text-transform: none; }

[type=button], [type=reset], [type=submit], button { -webkit-appearance: button; }

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { border-style: none; padding: 0; }

[type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring { outline: ButtonText dotted 1px; }

fieldset { padding: .35em .75em .625em; }

legend { color: inherit; display: table; max-width: 100%; white-space: normal; }

textarea { overflow: auto; }

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; }

[type=search] { -webkit-appearance: textfield; outline-offset: -2px; }

[type=search]::-webkit-search-decoration { -webkit-appearance: none; }

::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; }

summary { display: list-item; }

[hidden], template { display: none; }

/* basic-tags */
html { box-sizing: border-box; }

*, *:before, *:after { box-sizing: inherit; }

h1, h2, h3, h4, h5, h6, p, figure { margin: 0; }

h1, h2, h3, h4, h5, h6 { line-height: 1; }

html, body { font-family: "Noto Sans JP", "Hiragino Sans", "ヒラギノ角ゴシック", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", "Yu Gothic", "游ゴシック", "YuGothic", "游ゴシック体", "Meiryo", "メイリオ", "MS PGothic", "ＭＳ Ｐゴシック", sans-serif; line-height: 1.556; color: #000000; letter-spacing: -0.020em; }

body { background-color: #9bcbd0; }

body.courses-page { background-color: #b4cf71; }

a { text-decoration: none; -webkit-transition: color 0.15s linear 0s; -moz-transition: color 0.15s linear 0s; -ms-transition: color 0.15s linear 0s; -o-transition: color 0.15s linear 0s; transition: color 0.15s linear 0s; }

/* -------------------- basic-classes -------------------- */
.page-container { width: 100%; margin: 0 auto; position: relative; overflow: hidden; background: url(../img/common/minifig16@2x.png) right -17.188vw bottom 35.938vw/76.562vw auto no-repeat; }

@media screen and (min-width: 768px) { .page-container { background-position: right -17.574vw bottom 13.971vw; background-size: 76.618vw auto; } }

.courses-page .page-container { background: url(../img/common/minifig15@2x.png) left -31.562vw bottom -9.375vw/62.187vw auto no-repeat; }

@media screen and (min-width: 768px) { .courses-page .page-container { background: url(../img/common/minifig15@2x.png) left -17.059vw bottom 17.647vw/36.618vw auto no-repeat; } }

.sect-container { width: 100%; margin: 0 auto; position: relative; }

/* -------------------- utility-classes -------------------- */
.sr-only { display: none; }

@media screen and (min-width: 768px) { .sp-only { display: none; } }

@media screen and (min-width: 576px) { .xs-only { display: none; } }

@media screen and (max-width: 575px) { .sm-over { display: none; } }

@media screen and (max-width: 767px) { .pc-only { display: none; } }

.no-bullet { list-style: none; padding: 0; }

.no-margin { margin: 0; }

.text-center { text-align: center; }

.ps-header { width: 100%; height: 8.75vw; margin: 0 auto; overflow: hidden; position: relative; z-index: 100; }

@media screen and (min-width: 768px) { .ps-header { height: 70px; } }

.ps-header .phr-logo, .ps-header .sgr-logo { height: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; }

@media screen and (min-width: 768px) { .ps-header .phr-logo, .ps-header .sgr-logo { opacity: 1.0; -webkit-transition: opacity 0.15s linear 0s; -moz-transition: opacity 0.15s linear 0s; -ms-transition: opacity 0.15s linear 0s; -o-transition: opacity 0.15s linear 0s; transition: opacity 0.15s linear 0s; }
  .ps-header .phr-logo:hover, .ps-header .sgr-logo:hover { opacity: 0.7; } }

.ps-header .phr-logo { display: block; background: url(../img/ph/ph-logo-kpsp-w2@2x.png) center center/46.875vw auto no-repeat; }

@media screen and (min-width: 768px) { .ps-header .phr-logo { background: url(../img/ph/ph-logo-kpsp-w2@2x.png) left 35px center/271.8px auto no-repeat; float: left; width: 382px; } }

@media screen and (min-width: 992px) { .ps-header .phr-logo { background-size: 302px auto; } }

.ps-header .sgr-logo { display: none; float: right; width: 149px; background: url(../img/ph/ph-logo-sgrp-w@2x.png) left 12px top 24px/102.6px auto no-repeat; }

@media screen and (min-width: 768px) { .ps-header .sgr-logo { display: block; } }

@media screen and (min-width: 992px) { .ps-header .sgr-logo { background-position-x: left; background-size: 114px auto; } }

/*====================
page-footer
====================*/
.page-footer { color: #000000; padding: 40px 0 30px; }

@media screen and (min-width: 768px) { .page-footer { padding: 3.676vw 0 4.412vw; } }

.page-footer .sect-container { padding: 0 20px; }

.footer__notes { font-size: 11px; line-height: 1.625; text-align: center; }

@media screen and (min-width: 768px) { .footer__notes { font-size: 1.176vw; width: 69.853vw; margin: 0 auto; } }

.footer__sns-links { display: flex; height: 38px; list-style: none; margin: 20px auto 30px; padding-left: 0; width: 210px; }

@media screen and (min-width: 768px) { .footer__sns-links { margin: 3.676vw auto 2.206vw; } }

.footer__sns-links > .item { height: 37px; width: 70px; }

.footer__sns-links > .item > a { background-position: center center; background-repeat: no-repeat; background-size: 27px auto; display: block; height: 100%; width: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; -webkit-transition: opacity 0.15s linear 0s; -moz-transition: opacity 0.15s linear 0s; -ms-transition: opacity 0.15s linear 0s; -o-transition: opacity 0.15s linear 0s; transition: opacity 0.15s linear 0s; }

.footer__sns-links > .item > a:hover { opacity: 0.75; }

.footer__sns-links > .tw > a { background-image: url(../img/common/share_twi@2x.png); }

.footer__sns-links > .fa > a { background-image: url(../img/common/share_fac@2x.png); }

.footer__sns-links > .in > a { background-image: url(../img/common/share_ins@2x.png); }

.footer__colophon { font-size: 10px; text-align: center; }

@media screen and (min-width: 768px) { .footer__colophon { font-size: 12px; } }

.page-top { opacity: 1; position: fixed; right: 16px; bottom: 16px; z-index: 10; width: 48px; height: 48px; transition: opacity 1s linear; }

.page-top.hidden { opacity: 0; }

.page-top .link { display: block; width: 100%; height: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; background: rgba(0, 0, 0, 0.15) url(../img/pege-top-arrow@2x.png) 50% 45%/50% no-repeat; border-radius: 50%; }

@media screen and (min-width: 768px) { .page-top .link { -webkit-transition: background-color 0.15s linear 0s; -moz-transition: background-color 0.15s linear 0s; -ms-transition: background-color 0.15s linear 0s; -o-transition: background-color 0.15s linear 0s; transition: background-color 0.15s linear 0s; }
  .page-top .link:hover { background-color: #3fa1b7; } }

/*==================== mainmenu ====================*/
.mainmenu { width: 250px; height: 100vh; position: fixed; left: 0; top: 0; z-index: 1000; pointer-events: none; overflow: hidden; }

@media screen and (min-width: 768px) { .mainmenu { width: 270px; } }

.mainmenu__btn { width: 48px; height: 48px; background: rgba(255, 255, 255, 0.5) url(../img/menubtn/menubtn-up-label@2x.png) center center/42.857% auto no-repeat; pointer-events: all; cursor: pointer; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; text-indent: 100%; white-space: nowrap; overflow: hidden; position: absolute; top: 15px; left: 15px; -webkit-transition: all 0.15s linear 0s; -moz-transition: all 0.15s linear 0s; -ms-transition: all 0.15s linear 0s; -o-transition: all 0.15s linear 0s; transition: all 0.15s linear 0s; }

@media screen and (min-width: 768px) { .mainmenu__btn { top: 60px; left: 35px; }
  .mainmenu__btn:hover { background-color: #3fa1b7; } }

.active .mainmenu__btn { background-color: #ebebeb; background-image: url(../img/menubtn/menubtn-dn-label@2x.png); }

@media screen and (min-width: 768px) { .active .mainmenu__btn:hover { background-color: #73becf; } }

.mainmenu__list { position: absolute; left: -100%; top: 0; pointer-events: all; -webkit-transition: left 0.15s linear 0s; -moz-transition: left 0.15s linear 0s; -ms-transition: left 0.15s linear 0s; -o-transition: left 0.15s linear 0s; transition: left 0.15s linear 0s; background-color: #fff; width: 100%; height: 100vh; margin: 0; padding-left: 80px; list-style: none; }

@media screen and (min-width: 768px) { .mainmenu__list { padding-left: 110px; } }

.active .mainmenu__list { left: 0; }

.mainmenu__list a { display: block; width: 100%; height: 100%; line-height: 1.35; color: #222; padding-left: 10px; padding: 1.25em 0 1.25em 0.5em; }

@media screen and (min-width: 768px) { .mainmenu__list a { -webkit-transition: background-color 0.15s linear 0s; -moz-transition: background-color 0.15s linear 0s; -ms-transition: background-color 0.15s linear 0s; -o-transition: background-color 0.15s linear 0s; transition: background-color 0.15s linear 0s; }
  .mainmenu__list a:hover { background-color: #73becf; } }

.mainmenu__list .item.current a { background-color: #d2eaf0; }

@media screen and (min-width: 768px) { .mainmenu__list .item.current a:hover { background-color: #73becf; } }

@media screen and (min-width: 768px) { .courses-page .mainmenu__btn:hover { background-color: #659c3b; } }

@media screen and (min-width: 768px) { .courses-page .active .mainmenu__btn:hover { background-color: #8bc361; } }

@media screen and (min-width: 768px) { .courses-page .mainmenu__list a:hover { background-color: #8bc361; } }

.courses-page .mainmenu__list .item.current a { background-color: #cfe6bd; }

@media screen and (min-width: 768px) { .courses-page .mainmenu__list .item.current a:hover { background-color: #8bc361; } }

.sitehead__sect { margin-top: -8.75vw; }

@media screen and (min-width: 768px) { .sitehead__sect { margin-top: -70px; } }

.sitehead__sect .sect-container { background-color: #f9eabf; background-image: url(../img/common/sp_title_bg1@2x.png), url(../img/common/sp_title_bg2@2x.png); background-position: 50% 112.969vw, 50% 100%; background-repeat: no-repeat; background-size: contain; padding-bottom: 12.188vw; }

@media screen and (min-width: 768px) { .sitehead__sect .sect-container { background-image: url(../img/common/title_bg1@2x.png), url(../img/common/title_bg2@2x.png); background-position: 50% 47.353vw, 50% 100%; padding-bottom: 6.618vw; } }

.courses-page .sitehead__sect .sect-container { background-image: url(../img/common/sp_title_bg1@2x.png), url(../img/cs/cs_sp_title_bg2@2x.png); }

@media screen and (min-width: 768px) { .courses-page .sitehead__sect .sect-container { background-image: url(../img/common/title_bg1@2x.png), url(../img/cs/cs_title_bg2@2x.png); } }

.sitehead__title { background: url(../img/common/sp_title_img@2x.png) 0 0/cover no-repeat; height: 90.625vw; width: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; }

@media screen and (min-width: 768px) { .sitehead__title { background-image: url(../img/common/title_img@2x.png); height: 42.647vw; } }

.sitehead__lead { align-items: center; background-color: #4dadc2; border-radius: 50%; color: #fff; display: flex; font-size: 2.656vw; font-weight: bold; height: 24.688vw; justify-content: center; letter-spacing: normal; line-height: 1.455; position: absolute; right: 4.219vw; text-align: center; top: 73.438vw; width: 24.688vw; }

@media screen and (min-width: 768px) { .sitehead__lead { height: 15.441vw; width: 15.441vw; left: 71.324vw; top: 34.926vw; font-size: 1.618vw; } }

.sitehead__desc { line-height: 1.923; font-size: 4.062vw; font-weight: bold; padding-top: 1.65em; padding-bottom: 4.5em; text-align: center; }

@media screen and (min-width: 768px) { .sitehead__desc { font-size: 1.912vw; padding-bottom: 3em; } }

.sitehead__nav { display: flex; justify-content: space-between; margin: 0 2.031vw; }

@media screen and (min-width: 768px) { .sitehead__nav { margin: 0 auto; width: 67.5vw; } }

.sitehead__nav .navitem { flex-basis: 47.88%; height: 13.594vw; }

@media screen and (min-width: 768px) { .sitehead__nav .navitem { height: 9.559vw; } }

.sitehead__nav .navitem .link { background-size: 7.812vw auto; background-repeat: no-repeat; background-position: right bottom; border-radius: 0.625vw; color: #000000; display: flex; flex-direction: column; font-weight: bold; height: 100%; justify-content: center; letter-spacing: normal; text-align: center; }

@media screen and (min-width: 768px) { .sitehead__nav .navitem .link { background-size: 5.441vw auto; border-radius: 0.368vw; -webkit-transition: filter 0.15s linear 0s; -moz-transition: filter 0.15s linear 0s; -ms-transition: filter 0.15s linear 0s; -o-transition: filter 0.15s linear 0s; transition: filter 0.15s linear 0s; }
  .sitehead__nav .navitem .link:hover { filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.5)); } }

.sitehead__nav .navitem .label-upper { font-size: 2.656vw; }

@media screen and (min-width: 768px) { .sitehead__nav .navitem .label-upper { font-size: 1.838vw; } }

.sitehead__nav .navitem .label { font-size: 3.594vw; }

@media screen and (min-width: 768px) { .sitehead__nav .navitem .label { font-size: 2.574vw; } }

.sitehead__nav .navitem.goods .link { background-color: #9bcbd0; background-image: url(../img/common/title_btn_item_bg@2x.png); }

@media screen and (min-width: 768px) { .sitehead__nav .navitem.goods .link:hover { background-color: #b3d8db; } }

.sitehead__nav .navitem.courses .link { background-color: #b4cc31; background-image: url(../img/common/title_btn_cour_bg@2x.png); }

@media screen and (min-width: 768px) { .sitehead__nav .navitem.courses .link:hover { background-color: #bfd44d; } }

@media screen and (min-width: 768px) { .page-main { background-repeat: no-repeat; background-image: url(../img/common/minifig1@2x.png), url(../img/common/minifig3@2x.png), url(../img/common/minifig4@2x.png), url(../img/common/minifig6@2x.png), url(../img/common/minifig7@2x.png), url(../img/common/minifig9@2x.png), url(../img/common/minifig10@2x.png), url(../img/common/minifig13@2x.png), url(../img/common/minifig15@2x.png); background-position: 3.235vw 6.765vw, -1.471vw 58.897vw, 2.059vw 86.176vw, -7.206vw 144.779vw, 82.353vw 178.75vw, 76.765vw 253.235vw, -7.353vw 297.574vw, 73.235vw 407.941vw, -16.176vw 481.25vw; background-size: 15.809vw auto, 31.176vw auto, 17.279vw auto, 44.926vw auto, 16.176vw auto, 29.779vw auto, 29.265vw auto, 27.5vw auto, 36.618vw auto; } }

.page-main .page-title { font-size: 4.375vw; margin: 0.357em 0; text-align: center; }

@media screen and (min-width: 768px) { .page-main .page-title { font-size: 2.794vw; margin: 0.895em 0 0.5em; } }

.page-main .csmap { margin: 4.688vw auto; position: relative; width: 92.812vw; }

@media screen and (min-width: 768px) { .page-main .csmap { margin: 2.941vw auto 4.412vw; width: 69.853vw; } }

.page-main .csmap .fig-img { display: block; height: auto; width: 100%; }

.page-main .csmap__ornfig { position: absolute; }

.page-main .csmap__ornfig img { display: block; height: auto; width: 100%; }

.page-main .csmap__ornfig.right { height: 26.471vw; right: -9.853vw; top: 0.588vw; width: 13.676vw; }

.page-main .csmap__ornfig.left { height: 29.338vw; left: -11.691vw; top: 12.353vw; width: 15.882vw; }

@media screen and (min-width: 768px) { .courses-page .page-main { background-image: url(../img/common/minifig3@2x.png), url(../img/common/minifig4@2x.png), url(../img/common/minifig6@2x.png), url(../img/common/minifig9@2x.png), url(../img/common/minifig10@2x.png), url(../img/common/minifig13@2x.png), url(../img/common/minifig16@2x.png); background-position: -1.471vw 67.647vw, 2.059vw 94.853vw, -7.206vw 133.088vw, 76.765vw 180.882vw, -7.353vw 220.221vw, 73.235vw 216.176vw, 40.735vw 325.882vw; background-size: 31.176vw auto, 17.279vw auto, 44.926vw auto, 29.779vw auto, 29.265vw auto, 27.5vw auto, 76.618vw auto; } }

.shopnav { display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 6.25vw; }

@media screen and (min-width: 768px) { .shopnav { margin: 0 auto; padding-bottom: 2.941vw; width: 72.794vw; } }

.shopnav .navitem { background: url(../img/common/nav_bg_arrow@2x.png) center bottom/5vw auto no-repeat; height: 29.063vw; margin: 3.125vw 2.188vw; width: 26.562vw; }

@media screen and (min-width: 768px) { .shopnav .navitem { background-size: 2.353vw auto; height: 13.676vw; margin: 1.397vw 1.029vw; width: 12.5vw; } }

.shopnav .navitem-button .link { background-repeat: no-repeat; background-size: cover; display: block; height: 15.625vw; width: 26.562vw; text-indent: 100%; white-space: nowrap; overflow: hidden; }

@media screen and (min-width: 768px) { .shopnav .navitem-button .link { height: 7.353vw; width: 12.5vw; -webkit-transition: filter 0.15s linear 0s; -moz-transition: filter 0.15s linear 0s; -ms-transition: filter 0.15s linear 0s; -o-transition: filter 0.15s linear 0s; transition: filter 0.15s linear 0s; }
  .shopnav .navitem-button .link:hover { filter: drop-shadow(0px 1px 4px rgba(0, 0, 0, 0.5)); } }

.shopnav .navitem.taylo .link { background-image: url(../img/goods/nav_taylo@2x.png); }

.shopnav .navitem.pearl .link { background-image: url(../img/goods/nav_pearl@2x.png); }

.shopnav .navitem.calla .link { background-image: url(../img/goods/nav_calla@2x.png); }

.shopnav .navitem.beams .link { background-image: url(../img/goods/nav_beams@2x.png); }

.shopnav .navitem.newba .link { background-image: url(../img/goods/nav_newba@2x.png); }

.shopnav .navitem.desce .link { background-image: url(../img/goods/nav_desce@2x.png); }

.shopnav .navitem.black .link { background-image: url(../img/goods/nav_black@2x.png); }

.shopnav .navitem.oakle .link { background-image: url(../img/goods/nav_oakle@2x.png); }

.shopnav .navitem.saman .link { background-image: url(../img/goods/nav_saman@2x.png); }

.shopnav .navitem.puma .link { background-image: url(../img/goods/nav_puma@2x.png); }

.shopnav .navitem.kutsu .link { background-image: url(../img/goods/nav_kutsu@2x.png); }

.shopnav .navitem.boss .link { background-image: url(../img/goods/nav_boss@2x.png); }

.shopnav .navitem.regal .link { background-image: url(../img/goods/nav_regal@2x.png); }

.shopnav .navitem.boshi .link { background-image: url(../img/goods/nav_boshi@2x.png); }

.shopnav .navitem.pages .link { background-image: url(../img/goods/nav_pages@2x.png); }

.shopnav .navitem-name { align-items: center; display: flex; font-size: 2.5vw; height: 9.375vw; justify-content: center; letter-spacing: -0.1em; line-height: 1.375; text-align: center; }

@media screen and (min-width: 768px) { .shopnav .navitem-name { font-size: 1.176vw; height: 4.412vw; } }

.csnav__nav { margin: 0 auto 6.25vw; width: 92.812vw; }

@media screen and (min-width: 768px) { .csnav__nav { margin: 0 auto 5.147vw; width: 69.853vw; } }

.csnav__list { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; }

.csnav__list .navitem-button { flex: 0 0 46%; margin: 0 2%; min-height: 40px; align-items: center; display: flex; }

@media screen and (min-width: 768px) { .csnav__list .navitem-button { margin: 0 1.5%; } }

@media screen and (min-width: 992px) { .csnav__list .navitem-button { min-height: 3.529vw; } }

.csnav__list .navitem-button .link { align-items: center; background: url(../img/cs/cs_map_bullet@2x.png) left center/1em auto no-repeat; color: #000000; display: flex; font-size: 3.125vw; font-weight: bold; line-height: 1.35; padding-left: 1.45em; }

@media screen and (min-width: 768px) { .csnav__list .navitem-button .link { /*font-size: 1.838vw;*/ font-size: 1.5vw; } }

.reco__art { background-color: #fff; border-radius: 0.625vw; margin: 0 auto 6.25vw; padding: 0 4.688vw 2.5vw; position: relative; width: 92.812vw; opacity: 0; transition: opacity 1s linear; }

.reco__art:last-of-type { margin-bottom: 0; }

.reco__art.revealed { opacity: 1; }

@media screen and (min-width: 768px) { .reco__art { border-radius: 0.515vw; margin-bottom: 7.353vw; padding: 0 3.382vw 3.676vw; width: 69.853vw; }
  .reco__art:last-of-type { margin-bottom: 0; } }

@media screen and (min-width: 768px) { .courses-page .reco__art { padding-bottom: 1.206vw; } }

.reco__head { border-bottom: 1px solid #4dadc2; display: flex; flex-wrap: wrap; justify-content: center; margin-bottom: 3.75vw; padding: 2.5vw 0 2.5vw; }

@media screen and (min-width: 768px) { .reco__head { align-items: center; border-bottom-width: 2px; flex-wrap: nowrap; padding: 0.882vw 0 0.441vw; margin-bottom: 2.206vw; } }

.reco__head .head-logo { background-position: left center; background-repeat: no-repeat; background-size: contain; height: 7.812vw; text-indent: 100%; white-space: nowrap; overflow: hidden; text-indent: 300%; }

@media screen and (min-width: 768px) { .reco__head .head-logo { height: 4.632vw; width: 15.441vw; } }

.reco__head .head-title { align-items: center; color: #4dadc2; display: flex; font-size: 3.125vw; height: 7.812vw; margin-left: 5.625vw; }

@media screen and (min-width: 768px) { .reco__head .head-title { /*font-size: 1.838vw;*/ font-size: 1.6vw; height: auto; margin: 0 auto; } }

.reco__head .head-place { align-items: center; background-color: #4dadc2; color: #fff; display: flex; font-size: 2.188vw; font-weight: bold; height: 2.287em; justify-content: center; margin: 1em 12.5vw 0; width: 29.375vw; }

@media screen and (min-width: 768px) { .reco__head .head-place { font-size: 1.324vw; height: 2.222em; margin: 0; width: 17.441vw; } }

.courses-page .reco__head { border-bottom-color: #71af42; }

@media screen and (min-width: 768px) { .courses-page .reco__head { padding: 0.882vw 0; } }

@media screen and (min-width: 768px) { .courses-page .reco__head.logo-only { justify-content: space-between; } }

.courses-page .reco__head .head-logo { background-position: center center; }

@media screen and (min-width: 768px) { .courses-page .reco__head .head-logo { background-position: left center; height: 4.191vw; width: 18.75vw; } }

@media screen and (min-width: 768px) { .courses-page .reco__head.logo-only .head-logo { width: 33.088vw; } }

.courses-page .reco__head .head-title { color: #71af42; font-weight: bold; margin-left: 2.812vw; }

@media screen and (min-width: 768px) { .courses-page .reco__head .head-title { margin: 0 auto; } }

.courses-page .reco__head .head-place { background: #71af42 url(../img/cs/cs_art_car@2x.png) 3.5% 50%/6.25vw auto no-repeat; height: auto; width: auto; line-height: 1.25; padding: 0.3em 0.55em 0.3em 9.062vw; text-align: justify; letter-spacing: normal; }

@media screen and (min-width: 768px) { .courses-page .reco__head .head-place { background-size: 2.941vw auto; padding-left: 4.118vw; padding-right: 0.25em; width: 23.529vw; } }

.reco__art.taylo .head-logo { background-image: url(../img/goods/taylo_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.taylo .head-logo { width: 21.406vw; } }

@media screen and (min-width: 768px) { .reco__art.taylo .head-logo { background-size: 12.721vw auto; } }

.reco__art.pearl .head-logo { background-image: url(../img/goods/pearl_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.pearl .head-logo { width: 12.5vw; } }

@media screen and (min-width: 768px) { .reco__art.pearl .head-logo { background-size: 7.426vw auto; } }

.reco__art.calla .head-logo { background-image: url(../img/goods/calla_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.calla .head-logo { width: 12.812vw; } }

@media screen and (min-width: 768px) { .reco__art.calla .head-logo { background-size: 7.647vw auto; } }

.reco__art.beams .head-logo { background-image: url(../img/goods/beams_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.beams .head-logo { width: 11.562vw; } }

@media screen and (min-width: 768px) { .reco__art.beams .head-logo { background-size: 6.765vw auto; } }

.reco__art.newba .head-logo { background-image: url(../img/goods/newba_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.newba .head-logo { width: 10.469vw; } }

@media screen and (min-width: 768px) { .reco__art.newba .head-logo { background-size: 6.176vw auto; } }

.reco__art.desce .head-logo { background-image: url(../img/goods/desce_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.desce .head-logo { width: 17.031vw; } }

@media screen and (min-width: 768px) { .reco__art.desce .head-logo { background-size: 10vw auto; } }

.reco__art.black .head-logo { background-image: url(../img/goods/black_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.black .head-logo { width: 19.531vw; } }

@media screen and (min-width: 768px) { .reco__art.black .head-logo { background-size: 11.544vw auto; } }

.reco__art.oakle .head-logo { background-image: url(../img/goods/oakle_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.oakle .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.oakle .head-logo { background-size: 8.088vw auto; } }

.reco__art.saman .head-logo { background-image: url(../img/goods/saman_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.saman .head-logo { width: 18.75vw; } }

@media screen and (min-width: 768px) { .reco__art.saman .head-logo { background-size: 11.103vw auto; } }

.reco__art.puma .head-logo { background-image: url(../img/goods/puma_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.puma .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.puma .head-logo { background-size: 7.103vw auto; } }

.reco__art.kutsu .head-logo { background-image: url(../img/goods/kutsu_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.kutsu .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.kutsu .head-logo { background-size: 7.103vw auto; } }

.reco__art.boss .head-logo { background-image: url(../img/goods/boss_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.boss .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.boss .head-logo { background-size: 7.103vw auto; } }

.reco__art.regal .head-logo { background-image: url(../img/goods/regal_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.regal .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.regal .head-logo { background-size: 7.103vw auto; } }

.reco__art.boshi .head-logo { background-image: url(../img/goods/boshi_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.boshi .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.boshi .head-logo { background-size: 7.103vw auto; } }

.reco__art.pages .head-logo { background-image: url(../img/goods/pages_logo@2x.png); }

@media screen and (max-width: 767px) { .reco__art.pages .head-logo { width: 13.75vw; } }

@media screen and (min-width: 768px) { .reco__art.pages .head-logo { background-size: 7.103vw auto; } }



.courses-page .reco__art.seven_e .head-logo, .courses-page .reco__art.seven_w .head-logo, .courses-page .reco__art.seven_s .head-logo, .courses-page .reco__art.seven_n .head-logo { background-image: url(../img/cs/cs_seven_logo@2x.png); }

@media screen and (min-width: 768px) { .courses-page .reco__art.seven_e .head-logo, .courses-page .reco__art.seven_w .head-logo, .courses-page .reco__art.seven_s .head-logo, .courses-page .reco__art.seven_n .head-logo { background-size: 18.015vw auto; } }

.courses-page .reco__art.princ .head-logo { background-image: url(../img/cs/cs_princ_logo@2x.png); }

@media screen and (min-width: 768px) { .courses-page .reco__art.princ .head-logo { background-size: 33.088vw auto; } }

.courses-page .reco__art.seiza .head-logo { background-image: url(../img/cs/cs_seiza_logo@2x.png); }

@media screen and (min-width: 768px) { .courses-page .reco__art.seiza .head-logo { background-size: 22.515vw auto; } }

.courses-page .reco__art.asama .head-logo { background-image: url(../img/cs/cs_asama_logo@2x.png); }

@media screen and (min-width: 768px) { .courses-page .reco__art.asama .head-logo { background-size: 22.132vw auto; } }

.courses-page .reco__art.magoe .head-logo { background-image: url(../img/cs/cs_magoe_logo@2x.png); }

@media screen and (min-width: 768px) { .courses-page .reco__art.magoe .head-logo { background-size: 17.868vw auto; } }

@media screen and (min-width: 768px) { .reco__body { display: flex; } }

@media screen and (min-width: 768px) { .reco__body .body-fig { flex-grow: 0; flex-shrink: 0; order: 2; width: 25.735vw; } }

.reco__body .fig-img { display: block; height: auto; width: 100%; }

.reco__body .fig-img.bordered { border: 1px solid #c8c8c888; }

.reco__body .body-text { margin-top: 1.562vw; }

@media screen and (min-width: 768px) { .reco__body .body-text { margin-top: 0; order: 1; padding-right: 2.206vw; } }

.reco__body .body-text .body-title { font-size: 4.688vw; line-height: 1.4; margin-bottom: 0.65em; }

@media screen and (min-width: 768px) { .reco__body .body-text .body-title { font-size: 2.206vw; } }

.reco__body .body-text .body-desc { font-size: 2.812vw; line-height: 1.667; margin-bottom: 0.5em; }

@media screen and (min-width: 768px) { .reco__body .body-text .body-desc { font-size: 1.324vw; } }

.reco__body .body-text .body-price { font-size: 2.812vw; font-weight: bold; }

@media screen and (min-width: 768px) { .reco__body .body-text .body-price { font-size: 1.324vw; } }

@media screen and (min-width: 768px) { .courses-page .reco__body .body-fig { width: 35.294vw; } }

.courses-page .reco__body .body-spec, .courses-page .reco__body .body-feat { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; font-size: 2.812vw; line-height: 1.556; }

@media screen and (min-width: 768px) { .courses-page .reco__body .body-spec, .courses-page .reco__body .body-feat { font-size: 1.324vw; } }

.courses-page .reco__body .body-spec > li, .courses-page .reco__body .body-feat > li { margin: 0 0.25em 0.25em 0; border: 1px solid #71af42; padding: 0 0.35em; }

.courses-page .reco__body .body-spec .spec, .courses-page .reco__body .body-spec .torn, .courses-page .reco__body .body-feat .spec, .courses-page .reco__body .body-feat .torn { font-size: 2.969vw; line-height: 1.474; }

@media screen and (min-width: 768px) { .courses-page .reco__body .body-spec .spec, .courses-page .reco__body .body-spec .torn, .courses-page .reco__body .body-feat .spec, .courses-page .reco__body .body-feat .torn { font-size: 1.397vw; } }

.courses-page .reco__body .body-spec .spec, .courses-page .reco__body .body-feat .spec { background-color: #71af42; color: #fff; }

.courses-page .reco__body .body-spec .torn, .courses-page .reco__body .body-feat .torn { border-color: transparent; color: #71af42; padding: 0; }

.courses-page .reco__body .body-spec { margin-top: 1.25em; }

.reco__foot { margin-top: 7.812vw; }

@media screen and (min-width: 768px) { .reco__foot { display: flex; margin-top: 2.206vw; } }

@media screen and (min-width: 768px) { .reco__foot .foot-fig { flex-grow: 0; flex-shrink: 0; width: 18.382vw; } }

.reco__foot .fig-img { display: block; height: auto; width: 100%; }

.reco__foot .foot-text { margin-top: 3.75vw; }

@media screen and (min-width: 768px) { .reco__foot .foot-text { margin-top: 0; padding-left: 1.471vw; } }

.reco__foot .foot-text .foot-title { border-bottom: 2px solid #4dadc2; color: #4dadc2; font-size: 2.656vw; margin-bottom: 0.75em; padding-bottom: 0.75em; }

@media screen and (min-width: 768px) { .reco__foot .foot-text .foot-title { font-size: 1.25vw; } }

.reco__foot .foot-text .foot-desc { font-size: 2.656vw; line-height: 1.529; }

@media screen and (min-width: 768px) { .reco__foot .foot-text .foot-desc { font-size: 1.25vw; } }

.reco__foot .foot-text .foot-discount { background-color: #4dadc2; display: flex; font-weight: bold; padding: 1.875vw 2.5vw; margin: 1.562vw 0; }

@media screen and (min-width: 768px) { .reco__foot .foot-text .foot-discount { padding: 0.882vw 0.956vw; margin: 0; } }

.reco__foot .foot-text .foot-discount .label { align-items: center; background-color: #fff; color: #4dadc2; display: flex; font-size: 2.812vw; letter-spacing: normal; padding: 0.5em; white-space: nowrap; }

@media screen and (min-width: 768px) { .reco__foot .foot-text .foot-discount .label { font-size: 1.324vw; margin: 0.35em; padding: 0 0.75em; } }

.reco__foot .foot-text .foot-discount .body { color: #fff; font-size: 2.969vw; line-height: 1.579; padding-left: 0.5em; }

.reco__foot .foot-text .foot-discount .body small { font-size: 0.842em; }

@media screen and (min-width: 768px) { .reco__foot .foot-text .foot-discount .body { font-size: 1.397vw; padding-left: 0.2em; } }

.foot-link { display: flex; justify-content: center; margin-top: 1.562vw; }

@media screen and (min-width: 768px) { .foot-link { justify-content: flex-end; margin-top: 0; } }

.foot-link .link { align-items: center; background: url(../img/goods/details_arrow@2x.png) right center/auto 3.438vw no-repeat; color: #4dadc2; display: flex; font-size: 3.125vw; font-weight: bold; height: 9.375vw; justify-content: center; margin: 0 auto; padding-right: 4.688vw; }

@media screen and (min-width: 768px) { .foot-link .link { background-size: auto 1.544vw; font-size: 1.471vw; height: 4.412vw; margin: 0; padding-right: 2.206vw; -webkit-transition: filter 0.15s linear 0s; -moz-transition: filter 0.15s linear 0s; -ms-transition: filter 0.15s linear 0s; -o-transition: filter 0.15s linear 0s; transition: filter 0.15s linear 0s; }
  .foot-link .link:hover { filter: drop-shadow(0px 2px 1px rgba(0, 0, 0, 0.25)); } }

@media screen and (min-width: 768px) { .calla .foot-link { justify-content: flex-start; } }

@media screen and (min-width: 768px) { .courses-page .foot-link { justify-content: flex-start; } }

.courses-page .foot-link .link { color: #71af42; background-image: url(../img/cs/cs_details_arrow@2x.png); }

@media screen and (min-width: 768px) { .fig-img.pop { cursor: pointer; -webkit-transition: filter 0.15s linear 0s; -moz-transition: filter 0.15s linear 0s; -ms-transition: filter 0.15s linear 0s; -o-transition: filter 0.15s linear 0s; transition: filter 0.15s linear 0s; }
  .fig-img.pop:hover { border: none; filter: drop-shadow(0px 1px 4px rgba(0, 0, 0, 0.45)); } }

.reco__ornfig { position: absolute; }

.reco__ornfig img { display: block; height: auto; }

.reco__ornfig.taylo { right: -9.779vw; top: -17.426vw; }

.reco__ornfig.taylo img { width: 13.676vw; }

.reco__ornfig.pearl { top: -17.353vw; right: -33.456vw; }

.reco__ornfig.pearl img { width: 36.397vw; }

.reco__ornfig.beams { bottom: -1.103vw; left: -15.809vw; }

.reco__ornfig.beams img { width: 19.779vw; }

.reco__ornfig.desce { top: -25.735vw; right: -13.676vw; }

.reco__ornfig.desce img { width: 21.397vw; }

.reco__ornfig.desce2 { bottom: -20.809vw; left: -17.353vw; }

.reco__ornfig.desce2 img { width: 22.647vw; }

.reco__ornfig.black { bottom: -20.221vw; right: -31.765vw; }

.reco__ornfig.black img { width: 42.868vw; }

.courses-page .reco__ornfig.seven_e { top: -23.676vw; right: -33.456vw; }

.courses-page .reco__ornfig.seven_e img { width: 36.397vw; }

.courses-page .reco__ornfig.seven_w { top: -20.662vw; right: -13.75vw; }

.courses-page .reco__ornfig.seven_w img { width: 16.176vw; }

.courses-page .reco__ornfig.seven_w2 { bottom: -7.353vw; right: -14.779vw; }

.courses-page .reco__ornfig.seven_w2 img { width: 21.397vw; }

.courses-page .reco__ornfig.seven_n { top: -20.662vw; left: -15.662vw; }

.courses-page .reco__ornfig.seven_n img { width: 19.779vw; }

.courses-page .reco__ornfig.princ { bottom: -21.176vw; right: -31.765vw; }

.courses-page .reco__ornfig.princ img { width: 42.868vw; }

.courses-page .reco__ornfig.asama { top: -28.382vw; left: -17.059vw; }

.courses-page .reco__ornfig.asama img { width: 22.647vw; }

.figpop__shade { align-items: center; animation: fadein 0.5s; background-color: rgba(0, 0, 0, 0.75); cursor: pointer; display: flex; height: 100vh; justify-content: center; left: 0; position: fixed; top: 0; width: 100%; z-index: 1000; }

.figpop__img { border-radius: 10px; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5); cursor: default; height: 700px; width: 700px; }

@keyframes fadein { 0% { opacity: 0; }
  100% { opacity: 1; } }

.figpop__shade::after { content: '\2573'; display: block; position: absolute; right: 3.571vw; top: 3.571vw; font-size: 32px; color: #fff; width: 50px; height: 50px; text-align: center; border-radius: 8px; background-color: rgba(0, 0, 0, 0.75); }

/*# sourceMappingURL=common.css.map */
