@charset "UTF-8";
/*================================================================
 *FILE          :service.css
 *DESCRIPTION   :resetはressを使用。環境変数とmixinは_mixin.scss内に記述。
                 それぞれfoundationよりインポート。
 *AUTHOR        :
 *--------------------------------------------------------------
 *(C)
=================================================================*/
/* フォント定設
-----------------------------------------------------------------*/
@font-face {
  font-family: "MyYuGothicM";
  font-weight: normal;
  src: local("YuGothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular");
  /* 游ゴシックMediumが存在しないWindows8.1用 */
}
@font-face {
  font-family: "MyYuGothicM";
  font-weight: bold;
  src: local("YuGothic-Bold"), local("Yu Gothic Bold");
  /* PostScript Nameを認識できないChrome用にFull Nameを指定 */
}
/*--------------------------------
 INDEX
--------------------------------*/
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceSection_heading {
    width: 66.56vw;
  }
}

@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceSection_title {
    font-size: min(calc(20 / 375 * 100vw), 28px);
  }
}

@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceSection_text {
    font-size: min(calc(12 / 375 * 100vw), 16.8px);
  }
}

/*--------------------------------
 SERVICE LIST
--------------------------------*/
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList {
    margin-top: calc(80 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList {
    margin-top: calc(40 / 375 * 100vw);
  }
}

.serviceList_list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  list-style: none;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_list {
    gap: calc(40 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_list {
    gap: calc(40 / 375 * 100vw);
  }
}

.serviceList_item {
  border-top: 1px solid #dddddd;
}

@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_itemLink {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: calc(20 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_itemLink {
    display: block;
    padding-top: calc(40 / 375 * 100vw);
  }
}

.serviceList_info {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_info {
    width: calc(370 / 1280 * 100vw);
  }
}

.serviceList_name {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  letter-spacing: 0.3em;
  color: #414141;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_name {
    font-size: min(calc(16 / 1280 * 100vw), 22.4px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_name {
    font-size: min(calc(16 / 375 * 100vw), 22.4px);
  }
}

.serviceList_nameEn {
  display: block;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 300;
  letter-spacing: 0.2em;
  color: #414141;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_nameEn {
    margin-top: calc(10 / 1280 * 100vw);
    font-size: min(calc(12 / 1280 * 100vw), 16.8px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_nameEn {
    margin-top: calc(12 / 375 * 100vw);
    font-size: min(calc(12 / 375 * 100vw), 16.8px);
  }
}

.serviceList_body {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -ms-flex-item-align: start;
  align-self: flex-start;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_body {
    width: calc(450 / 1280 * 100vw);
    margin-left: calc(20 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_body {
    margin-top: calc(24 / 375 * 100vw);
  }
}

.serviceList_text {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  line-height: 2;
  letter-spacing: 0.1em;
  color: #414141;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_text {
    font-size: min(calc(14 / 1280 * 100vw), 19.6px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_text {
    font-size: min(calc(12 / 375 * 100vw), 16.8px);
    line-height: 2.08;
  }
}

@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_viewMore {
    margin-top: calc(24 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_viewMore {
    margin-top: calc(20 / 375 * 100vw);
  }
}

.serviceList_photo {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -ms-flex-item-align: start;
  align-self: flex-start;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .serviceList_photo {
    width: calc(200 / 1280 * 100vw);
    margin-top: auto;
    margin-left: calc(80 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .serviceList_photo {
    margin-top: calc(20 / 375 * 100vw);
  }
}

/*--------------------------------
 FOR BEIGINNERS
--------------------------------*/
.beginnersSection {
  background-image: url("../images/service/beginners-bg.jpg");
}

@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_card {
    width: calc(409 / 1280 * 100vw);
  }
}

.beginnersSection_subTitle {
  font-family: "Nunito Sans", sans-serif;
  font-weight: 300;
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: right;
  color: #000000;
  opacity: 0.5;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_subTitle {
    margin-bottom: calc(143 / 1280 * 100vw);
    font-size: min(calc(16 / 1280 * 100vw), 22.4px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .beginnersSection_subTitle {
    margin-bottom: calc(73 / 375 * 100vw);
    font-size: min(calc(16 / 375 * 100vw), 22.4px);
  }
}

.beginnersSection_title {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.3em;
  color: #414141;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_title {
    margin-bottom: calc(20 / 1280 * 100vw);
    font-size: min(calc(20 / 1280 * 100vw), 28px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .beginnersSection_title {
    margin-bottom: calc(20 / 375 * 100vw);
    font-size: min(calc(20 / 375 * 100vw), 28px);
    line-height: 1.59;
  }
}

.beginnersSection_text {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  line-height: 2;
  letter-spacing: 0.1em;
  color: #000000;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_text {
    margin-top: calc(20 / 1280 * 100vw);
    font-size: min(calc(14 / 1280 * 100vw), 19.6px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .beginnersSection_text {
    margin-top: calc(20 / 375 * 100vw);
    font-size: min(calc(12 / 375 * 100vw), 16.8px);
  }
}

.beginnersSection_viewMore {
  gap: 10px;
  text-align: right;
  text-decoration: none;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_viewMore {
    margin-top: calc(20 / 1280 * 100vw);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .beginnersSection_viewMore {
    margin-top: calc(20 / 375 * 100vw);
  }
}

.beginnersSection_viewMore_text {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: #000000;
}
@media print, screen and (min-width:1024px) and (orientation: landscape), screen and (min-width:1024px) {
  .beginnersSection_viewMore_text {
    gap: calc(10 / 1280 * 100vw);
    font-size: min(calc(12 / 1280 * 100vw), 16.8px);
  }
}
@media print, screen and (max-width:1023px), screen and (min-width:1024px) and (max-width:1023px) and (orientation: portrait) {
  .beginnersSection_viewMore_text {
    gap: calc(10 / 375 * 100vw);
    font-size: min(calc(10 / 375 * 100vw), 14px);
  }
}
.beginnersSection_viewMore_text::before {
  display: block;
  width: 10px;
  height: 1px;
  background-color: #414141;
  content: "";
}
/*# sourceMappingURL=maps/service.css.map */