@charset "utf-8";



@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;500;600;700&display=swap");



:root {

  --color-main: #fc77a3;;

  --color-accent: #ff76a4;

  --color-orange: #ffa614;

}



html{height:-webkit-fill-available}@media screen and (max-width:768px){body{min-width:auto}}h1,h2,h3,h4,h5,h6{margin:0;font-weight:700}p{margin:0}dd,dl,ol,ul{margin:0;padding:0}li{list-style:none}a{text-decoration:none}a,img{-webkit-transition:all .3s;transition:all .3s}strong{font-weight:400}img{max-width:100%;vertical-align:middle}button,input{padding:0;border:0;outline:0}th{font-weight:400}blockquote,body,code,dd,div,dl,dt,fieldset,figcaption,figure,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,pre,td,textarea,th,ul{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:400}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}q:after,q:before{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,select,textarea{font-family:inherit;font-size:inherit;font-weight:inherit;font-size:100%}legend{color:#fff}hr{display:none}img{vertical-align:bottom}button,input,select,textarea{font-size:99%}table{font-size:inherit;font:100%;border-collapse:collapse;border-spacing:0}code,kbd,pre,samp,tt{font-family:monospace;*font-size:108%;line-height:100%}.hd{display:block;width:0;height:0;overflow:hidden}.cf:after,.cf:before{content:"";display:table}.cf:after{clear:both}.cf{*zoom:1}article,aside,details,figcaption,figure,footer,header,hgroup,hr,main,menu,nav,section{display:block}*{margin:0;padding:0;box-sizing:border-box;max-height:999999px}*,:focus{outline:0}button{background-color:transparent;border:0;cursor:pointer;outline:0;padding:0}

html{-webkit-box-sizing:border-box;box-sizing:border-box;overflow-y:scroll;-webkit-text-size-adjust:100%}*,:after,:before{background-repeat:no-repeat;-webkit-box-sizing:inherit;box-sizing:inherit}:after,:before{text-decoration:inherit;vertical-align:inherit}*{padding:0;margin:0}audio:not([controls]){display:none;height:0}hr{overflow:visible}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}summary{display:list-item}small{font-size:80%}[hidden],template{display:none}abbr[title]{border-bottom:1px dotted;text-decoration:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}code,kbd,pre,samp{font-family:monospace}b,strong{font-weight:bolder}dfn{font-style:italic}mark{background-color:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}input{border-radius:0}[role=button],[type=button],[type=reset],[type=submit],button{cursor:pointer}[disabled]{cursor:default}[type=number]{width:auto}[type=search]{-webkit-appearance:textfield}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}textarea{overflow:auto;resize:vertical}button,input,optgroup,select,textarea{font:inherit}optgroup{font-weight:700}button{overflow:visible}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button::-moz-focus-inner{border-style:0;padding:0}[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner,button:-moz-focusring{outline:1px dotted ButtonText}[type=reset],[type=submit],button,html [type="button"]{-webkit-appearance:button}button,select{text-transform:none}button,input,select,textarea{background-color:transparent;border-style:none;color:inherit}select{-moz-appearance:none;-webkit-appearance:none}select::-ms-expand{display:none}select::-ms-value{color:currentColor}legend{border:0;color:inherit;display:table;max-width:100%;white-space:normal}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}img{border-style:none}progress{vertical-align:baseline}svg:not(:root){overflow:hidden}audio,canvas,progress,video{display:inline-block}@media screen{[hidden~=screen]{display:inherit}[hidden~="screen"]:not(:active):not(:focus):not(:target){position:absolute!important;clip:rect(0 0 0 0)!important}}[aria-busy=true]{cursor:progress}[aria-controls]{cursor:pointer}[aria-disabled]{cursor:default}::-moz-selection{background-color:#b3d4fc;color:#000;text-shadow:none}::selection{background-color:#b3d4fc;color:#000;text-shadow:none}html{font-size:62.5%;-webkit-box-sizing:border-box;box-sizing:border-box}*,:after,:before{-webkit-box-sizing:inherit;box-sizing:inherit}



body {

  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  -webkit-font-feature-settings: "palt"1;

  font-feature-settings: "palt"1;

  text-rendering: optimizeLegibility;

  letter-spacing: 0.05em;

  word-wrap: break-word;

  overflow-wrap: break-word;

  color: #222;

  position: relative;

  min-height: 100vh;

  /* mobile viewport bug fix */

  min-height: -webkit-fill-available;

}



/*-----------------------------------------------

 * 01. Template

 * 00. Modal

-------------------------------------------------*/

/*-----------------------------------------------

 * 01. Template

-------------------------------------------------*/

@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 100;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 200;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 300;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Medium");

  font-weight: 400;

}



@font-face {

  font-family: "Yu Gothic";

  src: local("Yu Gothic Bold");

  font-weight: bold;

}



body {

  -webkit-text-size-adjust: 100%;

  background-color: #fff;

  color: #000;

  font-family: "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;

  font-feature-settings: "palt";

  font-size: 14px;

  font-weight: normal;

  letter-spacing: 0.07em;

  line-height: 1.8;

  word-wrap: break-word;

}



.pc {

  display: block;

}



.sp {

  display: none;

}



a {

  color: #fc77a3;

}



a:hover {

  opacity: .7;

  text-decoration: none;

}



.ah {

  transition: opacity .3s ease;

}



.ah:hover {

  opacity: .7;

}



::selection {

  background: #6ccfee;

  color: #fff;

}



::-moz-selection {

  background: #6ccfee;

  color: #fff;

}



@media screen and (max-width:768px) {

  html {

    font-size: 62.5%;

  }



  body {

    font-size: 10px;

    font-size: 1rem;

    min-width: 320px;

  }



  .sp {

    display: block;

  }



  .pc {

    display: none;

  }



  .ah:hover {

    opacity: 1;

  }

}



/*-----------------------------------------------

* font

-------------------------------------------------*/

.font-jsf{

  font-family: "Josefin Sans", sans-serif;

}



/*-----------------------------------------------

 * 00. Modal

-------------------------------------------------*/

.modalBox {

  -webkit-overflow-scrolling: touch;

  background: rgba(255, 255, 255, 0.95);

  display: none;

  width: 100%;

  height: 100%;

  overflow: auto;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 9999;

}



.oneModal {

  display: none;

  width: 100%;

  height: 100%;

  position: relative;

  z-index: 1;

}



.oneModalIn {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -ms-flex-align: center;

  -webkit-align-items: center;

  align-items: center;

  height: auto;

  width: 100%;

  min-width: 1200px;

  min-height: 100%;

  margin: 0 auto;

  position: relative;

}



.oneModalIn__cont {

  padding: 50px 0;

}



@media screen and (max-width:768px) {

  .oneModalIn {

    min-width: 100%;

  }



  .oneModalIn__cont {

    width: 100%;

    padding: 30px 0;

  }

}



/* closeBtn */

.closeBtn {

  width: 100%;

  height: 100%;

  min-width: 1200px;

  pointer-events: none;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 2;

}



.closeBtn a {

  -webkit-mask-image: url(../../assets/img/common/icon_modal_close.svg);

  mask-image: url(../../assets/img/common/icon_modal_close.svg);

  mask-repeat: no-repeat;

  background-color: var(--color-main);

  display: block;

  width: 62px;

  height: 40px;

  pointer-events: auto;

  position: absolute;

  top: 0;

  right: 0;

}



@media screen and (max-width:768px) {

  .closeBtn {

    min-width: 100%;

  }



  .closeBtn a {

    width: 40px;

    height: 40px;

  }

}



/* common */

.commonIframe {

  width: 100%;

  height: 100%;

  display: block;

}



/* youtube */

.youtubeIframeWrap {

  width: 920px;

  height: 520px;

}



@media screen and (max-width:768px) {

  .youtubeIframeWrap {

    width: 100%;

    height: auto;

    padding-top: 56.25%;

    position: relative;

  }



  .youtubeIframe {

    position: absolute;

    top: 0;

    left: 0;

  }

}



@media screen and (max-width: 768px) {

  .sp-none {

    display: none

  }

}



.pc-none {

  display: none

}



@media screen and (max-width: 768px) {

  .pc-none {

    display: block

  }

}



.is-fixed {

  position: fixed;

  top: 0;

  right: 0;

  bottom: 0;

  left: 0

}



.is-none {

  opacity: 0 !important

}



.is-hide {

  display: none

}



.indent--1 {

  display: block;

  padding-left: 1em;

  text-indent: -1em;

}



.red{

  font-weight: 900;

  color: red;

}





/*-----------------------------------------------

* 共通パーツ

-------------------------------------------------*/



/* c_icon */

.c_icon {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: start;

  -ms-flex-pack: start;

  justify-content: flex-start;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

}



.c_icon::before {

  content: '';

  display: block;

  width: 2.4rem;

  height: 2.4rem;

  -webkit-transition: all .3s;

  transition: all .3s;

  -webkit-mask-repeat: no-repeat;

  mask-repeat: no-repeat;

}



@media screen and (max-width: 768px) {

  .c_icon::before {

    width: 2rem;

    height: 2rem;

  }

}



.c_icon.icon_modal_close::before {

  /* background: url("../../assets/img/common/icon_modal_close.svg") no-repeat center center/contain; */

  -webkit-mask-image: url(../../assets/img/common/icon_modal_close.svg);

  mask-image: url(../../assets/img/common/icon_modal_close.svg);

  background-color: var(--color-main);

}



.c_icon.icon_arrow::before {

  -webkit-mask-image: url("../../assets/img/common/icon_arrow.svg");

  mask-image: url("../../assets/img/common/icon_arrow.svg");

}



.c_icon.icon_menu_01::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_01.svg");

  mask-image: url("../../assets/img/common/icon_menu_01.svg");

}



.c_icon.icon_menu_02::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_02.svg");

  mask-image: url("../../assets/img/common/icon_menu_02.svg");

}



.c_icon.icon_menu_03::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_03.svg");

  mask-image: url("../../assets/img/common/icon_menu_03.svg");

}



.c_icon.icon_menu_04::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_04.svg");

  mask-image: url("../../assets/img/common/icon_menu_04.svg");

}



.c_icon.icon_menu_05::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_05.svg");

  mask-image: url("../../assets/img/common/icon_menu_05.svg");

}



.c_icon.icon_menu_06::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_06.svg");

  mask-image: url("../../assets/img/common/icon_menu_06.svg");

}



.c_icon.icon_menu_07::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_07.svg");

  mask-image: url("../../assets/img/common/icon_menu_07.svg");

}



.c_icon.icon_menu_08::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_08.svg");

  mask-image: url("../../assets/img/common/icon_menu_08.svg");

}



.c_icon.icon_menu_09::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_09.svg");

  mask-image: url("../../assets/img/common/icon_menu_09.svg");

}



.c_icon.icon_menu_10::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_10.svg");

  mask-image: url("../../assets/img/common/icon_menu_10.svg");

}



.c_icon.icon_menu_11::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_11.svg");

  mask-image: url("../../assets/img/common/icon_menu_11.svg");

}



.c_icon.icon_menu_12::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_12.svg");

  mask-image: url("../../assets/img/common/icon_menu_12.svg");

}



.c_icon.icon_menu_13::before {

  -webkit-mask-image: url("../../assets/img/common/icon_menu_13.svg");

  mask-image: url("../../assets/img/common/icon_menu_13.svg");

}



/* c_btn */

.c_btn {

  position: relative;

  border-radius: 30px;

  border-radius: 30px;

  padding: 1rem 2rem;

  margin: 0 auto;

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

  cursor: pointer;

  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;

  -webkit-transition: all .3s;

  transition: all .3s;

}



.c_btn:hover {

  opacity: .7;

}



.c_btn a,

.c_btn input {

  width: 100%;

  height: 100%;

  display: block;

  color: #fff;

  font-size: 1.6rem;

  font-weight: 500;

  text-align: center;

}



.c_btn.btn_large {

  width: 35rem;

}



.c_btn.btn_medium {

  width: 28rem;

}



.c_btn.btn_small {

  width: 20rem;

}



.c_btn.btn_red {

  background-color: #B90404;

}



.c_btn.btn_blue {

  background-color: #26468F;

}



.c_btn.btn_gray {

  background-color: #666;

}



.c_btn.btn_arrow-right::after {

  content: '';

  display: block;

  width: 8px;

  height: 8px;

  border-top: 2px solid #fff;

  border-right: 2px solid #fff;

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg);

}



.c_btn.btn_arrow-left::before {

  content: '';

  display: block;

  width: 8px;

  height: 8px;

  border-top: 2px solid #fff;

  border-right: 2px solid #fff;

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg);

  -webkit-transform: rotate(-135deg);

  transform: rotate(-135deg);

}



/*--------------------------------------

コンバージョンアップボタン 緑色（中央寄せ）

--------------------------------------*/

.c_btn_square a {

  width: 100%;

  padding: 0.25rem 2rem 0.5rem 3.5rem;

  text-align: center;

  position: relative;

  border-radius: .25rem;

  padding: 10px 0;

  font-size: 1.6rem;

  font-weight: 500;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  -webkit-transition: all .25s;

  transition: all .25s;

}



.c_btn_square a:hover {

  -webkit-transform: translate(0, 3px);

  transform: translate(0, 3px);

}



.c_btn_square a .c_icon::before {

  width: 18px;

  height: 18px;

}



.btn_square_blue {

  color: #26468F;

  background: #fff;

  border: 2px solid #25468F;

  -webkit-box-shadow: 0 4px 0 #25468F;

  box-shadow: 0 4px 0 #25468F;

}



.btn_square_blue:hover {

  -webkit-box-shadow: 0 2px 0 #25468F;

  box-shadow: 0 2px 0 #25468F;

}



.btn_square_blue .c_icon::before {

  background-color: #25468F;

}



.btn_square_orange {

  color: #fff;

  background: #f06d0c;

  border: 2px solid #EE7801;

  -webkit-box-shadow: 0 4px 0 #BF6000;

  box-shadow: 0 4px 0 #BF6000;

}



.btn_square_orange:hover {

  background: #f06d0c;

  -webkit-box-shadow: 0 2px 0 #8b3a00;

  box-shadow: 0 2px 0 #8b3a00;

}



.btn_square_orange .c_icon::before {

  background-color: #fff;

}



.btn_square_yellow {

  color: #333;

  background: #fff85e;

  border: 2px solid #fff85e;

  -webkit-box-shadow: 0 4px 0 #c0b70b;

  box-shadow: 0 4px 0 #c0b70b;

}



.btn_square_yellow:hover {

  background: #fff872;

  border: 2px solid #fff85e;

  -webkit-box-shadow: 0 2px 0 #c0b70b;

  box-shadow: 0 2px 0 #c0b70b;

}



.btn_square_yellow .c_icon::before {

  background-color: #30a6e9;

}



.btn_microcopy {

  font-size: 1.4rem;

  line-height: 1;

  position: absolute;

  top: -3.6rem;

  left: calc(50% - 200px);

  display: block;

  width: 420px;

  padding: 0.5rem 0;

  color: #333;

  border: 2px solid #333;

  border-radius: 0.5rem;

  background: #fff;

  -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);

  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);

}



@media screen and (max-width: 768px) {

  .btn_microcopy {

    width: 100%;

    top: -4rem;

    left: calc(50% - 50%);

    font-size: 1.2rem;

  }

}



/*-----------------------------------------------

 * wrapper

-------------------------------------------------*/

.wrapper {

  position: relative;

  font-size: 16px;

  letter-spacing: .1em

}



@media screen and (min-width: 769px) {

  .wrapper {

    /* max-width: 200rem; */

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: start;

    -ms-flex-pack: start;

    justify-content: flex-start;

    margin: 4rem auto

  }

}



@media screen and (max-width: 768px) {

  .wrapper {

    width: 100%;

    margin: 10% auto 0

  }

}



.c_title_h2 {

  font-family: "Josefin Sans", sans-serif;

  font-size: 6.8rem;

  line-height: 1;

  color: var(--color-main);

  font-weight: 400;

  letter-spacing: .5rem;

  margin-bottom: 3rem

}



@media screen and (max-width: 768px) {

  .c_title_h2 {

    font-size: 3.4rem;

    font-weight: 600;

    white-space: nowrap;

    margin-bottom: 0rem

  }

}



@media screen and (min-width: 769px) {

  .sub {

    width: 14vw;

    min-width: 26rem;

    height: -webkit-fit-content;

    height: -moz-fit-content;

    height: fit-content;

    margin: 0 0 0 2vw;

    position: sticky;

    left: 0;

    top: 20px;

    z-index: 10

  }

}



/*-----------------------------------------------

 * header

-------------------------------------------------*/

.header.fixed {

  position: fixed

}



@media screen and (min-width: 769px) {

  .header {

    width: 26rem;

    border: 3px solid var(--color-main);

    -webkit-box-shadow: 5px 3px var(--color-main);

    box-shadow: 5px 3px var(--color-main);

    background-color: #fff;

    border-radius: 4rem;

    z-index: 10

  }

}



@media screen and (max-width: 768px) {

  .header {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-pack: end;

    -ms-flex-pack: end;

    justify-content: flex-end;

    -webkit-box-orient: vertical;

    -webkit-box-direction: reverse;

    -ms-flex-direction: column-reverse;

    flex-direction: column-reverse;

    width: 100%;

    height: 100vh;

    background-color: var(--color-main)

  }

}



.header__body {

  padding: 2rem 2.5rem 2rem;

}



@media screen and (max-width: 768px) {

  .header__body {

    padding: 2rem 12% 12rem;

    overflow: auto;

  }

}



.header__item {

  position: relative

}



.header__item.c_icon::before {

  width: 26px;

  height: 26px;

  background-color: var(--color-main);

  -webkit-mask-repeat: no-repeat;

  mask-repeat: no-repeat;

  -webkit-mask-position: center;

  mask-position: center

}



@media screen and (max-width: 768px) {

  .header__item.c_icon::before {

    background-color: #fff

  }

}



.header__item.c_icon:hover::before {

  -webkit-animation: ani-bounce .3s ease infinite alternate;

  animation: ani-bounce .3s ease infinite alternate

}



.header__item a {

  padding: 0.8rem 0 0 1rem;

  font-size: 18px;

  font-weight: 700;

  letter-spacing: .1em;

  font-family: "Josefin Sans", sans-serif

}



@media screen and (min-width: 769px) {

  .header__item a {

    color: var(--color-main)

  }

}



@media screen and (max-width: 768px) {

  .header__item a {

    padding-left: 1.6rem;

    font-size: 2.2rem;

    color: #fff

  }

}



@media screen and (min-width: 769px) {

  .header__logo {

    background-color: var(--color-main);

    border-radius: 0 0 4rem 4rem;

    border: 3px solid #fff

  }

}



.header__logo img {

  max-width: 16rem;

  display: block;

  margin: 0 auto;

  padding: 2rem 0 2.5rem

}



@media screen and (max-width: 768px) {

  .header__logo img {

    max-width: 14rem;

    padding: 2.2rem 0 2.5rem 2rem

  }

}





/*-----------------------------------------------

 * footer

-------------------------------------------------*/

.footer {

  width: 100%;

  padding: 6rem 2rem 15rem;

  position: relative;

  background-color: var(--color-main)

}



.footer__inner {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center

}



@media screen and (max-width: 768px) {

  .footer__inner {

    -webkit-box-orient: vertical;

    -webkit-box-direction: reverse;

    -ms-flex-direction: column-reverse;

    flex-direction: column-reverse

  }

}



.footer__share {

  width: 20rem

}



.footer__share--body {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center

}



.footer__share--ttl {

  font-family: "Josefin Sans", sans-serif;

  font-size: 16px;

  font-weight: 500;

  color: #fff

}



.footer__logo {

  width: 28rem

}



@media screen and (max-width: 768px) {

  .footer__logo {

    margin-bottom: 4rem

  }

}



.footer__top .icon_arrow {

  -webkit-transform: rotate(-90deg);

  transform: rotate(-90deg);

  position: relative;

}



@media screen and (max-width: 768px) {

  .footer__top .icon_arrow {

    width: 50px;

    height: 50px;

    position: absolute;

    top: 50%;

    right: 50%;

    transform: rotate(-90deg) translate(50%, 50%);

    z-index: 1;

    -webkit-transition: all .3s;

    transition: all .3s;

  }

}



.footer__top .icon_arrow::before {

  width: 5rem;

  height: 5rem;

  background-color: #fff;

  position: relative;

}



.footer__top:hover {

  -webkit-animation: ani-bounce .3s ease infinite alternate;

  animation: ani-bounce .3s ease infinite alternate

}



@media screen and (max-width: 768px) {

  .footer__top {

    position: absolute;

    bottom: 5rem

  }

}



.footer__copy {

  margin-top: 2rem

}



.footer__copy--text {

  color: #fff;

  font-size: 12px;

  font-weight: 600;

  text-align: left;

  letter-spacing: .2em

}



@media screen and (max-width: 768px) {

  .footer__copy--text {

    font-size: .8rem;

    text-align: center

  }

}



.footer__copy--text a{

  color: #fff;

  text-decoration: underline;

}



/*-----------------------------------------------

 * modal

-------------------------------------------------*/

.modal {

  display: none;

  background: rgba(255, 255, 255, 0.95);

  height: 100vh;

  width: 100%;

  height: 100%;

  overflow: auto;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 9999;

}



.modal__bg {

  position: absolute;

  width: 100%

}



.modal__content {

  width: 60%;

  height: 100%;

  min-height: 1000px;

  margin: 0 auto;

  padding: 10rem 4rem;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}



@media screen and (max-width: 768px) {

  .modal__content {

    width: 90%;

    min-height: 500px;

    padding: 80px 0px;

    margin: 0 auto;

    display: block;

  }

}



.modal__img {

  width: 42rem;

  margin: 0 auto;

  overflow: hidden;

  margin-bottom: 2rem;

}



.modal__img img {

  width: 100%;

  height: auto;

  display: block;

  border-radius: 3rem

}



@media screen and (max-width: 768px) {

  .modal__img{

    width: 100%;

    margin: 0 auto 24px;

    overflow: auto;

  }



  .modal__img img{

    display: block;

    margin: 0 auto;

  }

}



.modal__img img.img_kyakuhon {

  border-radius: 0rem

}



.modal__text {

  color: var(--color-main);

  font-size: 1.2em;

  font-weight: bold;

  text-align: left;

  letter-spacing: .1em;

  padding-bottom: 40px;

}



@media screen and (max-width: 768px) {

  .modal__text {

    font-size: 1.4rem;

    font-weight: normal;

    padding-bottom: 20px;

  }

}



.modal__close {

  position: absolute;

  top: 5rem;

  right: 5rem;

  z-index: 999;

}



.modal__close:hover {

  -webkit-transform: scale(1.1);

  transform: scale(1.1)

}



@media screen and (max-width: 768px) {

  .modal__close {

    top: 2%;

    right: 2%

  }

}



.modal__close .c_icon::before {

  width: 62px;

  height: 40px

}



@media screen and (max-width: 768px) {

  .modal__close .c_icon::before {

    width: 64px;

    height: 40px

  }

}



/*-----------------------------------------------

 * fix

-------------------------------------------------*/

body.fixed {

  position: fixed;

  left: 0

}



.fixed {

  position: fixed

}



/*-----------------------------------------------

 * js-hamburgerMenu

-------------------------------------------------*/

.js-hamburgerMenu {

  display: block;

  position: fixed;

  z-index: 999;

  width: 100%;

  height: 4rem;

  cursor: pointer;

  text-align: center;

  background-color: var(--color-main);

  top: -1px;

  left: 0;

  display: flex;

  justify-content: center;

  align-items: flex-start;

}



.js-hamburgerMenu.active {

  background-color: #fff

}



.js-hamburgerMenu.active span {

  background: var(--color-main)

}



@media screen and (min-width: 769px) {

  .js-hamburgerMenu {

    display: none

  }

}



.js-hamburgerMenu span {

  display: block;

  position: absolute;

  width: 29px;

  height: 3px;

  left: -8px;

  background: #fff;

  -webkit-transition: 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



.js-hamburgerMenu span:nth-child(1) {

  top: 12px

}



.js-hamburgerMenu span:nth-child(2) {

  top: 19px

}



.js-hamburgerMenu span:nth-child(3) {

  top: 26px

}



.js-hamburgerMenu.active span:nth-child(1) {

  top: 19px;

  -webkit-transform: rotate(-45deg);

  transform: rotate(-45deg)

}



.js-hamburgerMenu.active span:nth-child(2) {

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg)

}



.js-hamburgerMenu.active span:nth-child(3) {

  opacity: 0;

}



.js-hamburger-in{

  position: relative;

}



/*-----------------------------------------------

 * globalMenuSp

-------------------------------------------------*/

@media screen and (max-width: 768px) {

  .globalMenuSp {

    position: fixed;

    z-index: 101;

    top: 3.5rem;

    left: 0;

    -webkit-transition: transform .5s;

    transition: transform .5s;

    -webkit-transform: translateX(-100%);

    transform: translateX(-150%);

    width: 100%

  }



  .globalMenuSp.active {

    -webkit-transform: translateX(0%);

    transform: translateX(0%)

  }

}



.js-scrollMenu-active.c_icon::before {

  -webkit-animation: ani-bounce .3s ease infinite alternate;

  animation: ani-bounce .3s ease infinite alternate

}





/*-----------------------------------------------

 * animation

-------------------------------------------------*/

.ani_borderleft {

  overflow: hidden

}



.ani_borderleft::before {

  content: "";

  z-index: -1;

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: -100%;

  background-color: var(--color-main);

  -webkit-transition: all .3s;

  transition: all .3s

}



.ani_borderleft:hover {

  color: #fff

}



.ani_borderleft:hover:before {

  left: 0

}



.ani_borderleft.btn_pink::before {

  background-color: var(--color-accent);

}



.ani_bordertop {

  overflow: hidden

}



.ani_bordertop::before {

  content: "";

  z-index: -1;

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0%;

  left: -100%;

  background-color: var(--color-main);

  -webkit-transition: all .3s;

  transition: all .3s

}



.ani_bordertop:hover {

  color: #fff

}



.ani_bordertop:hover:before {

  left: 0%

}



.ani-bounce {

  -webkit-animation: ani-bounce .3s ease infinite alternate;

  animation: ani-bounce .3s ease infinite alternate

}



@-webkit-keyframes ani-bounce {

  0% {

    -webkit-transform: translateY(0px);

    transform: translateY(0px)

  }



  100% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px)

  }

}



@keyframes ani-bounce {

  0% {

    -webkit-transform: translateY(0px);

    transform: translateY(0px)

  }



  100% {

    -webkit-transform: translateY(-8px);

    transform: translateY(-8px)

  }

}



.ani-fadeUp {

  -webkit-animation-name: ani-fadeUpAnime;

  animation-name: ani-fadeUpAnime;

  -webkit-animation-duration: 0.5s;

  animation-duration: 0.5s;

  -webkit-animation-fill-mode: forwards;

  animation-fill-mode: forwards;

  opacity: 0;

  transition: all .3s ease-out;

}



@-webkit-keyframes ani-fadeUpAnime {

  from {

    opacity: 0;

    -webkit-transform: translate(0%, 30%);

    transform: translate(0%, 30%)

  }



  to {

    opacity: 1;

    -webkit-transform: translate(0%, 0%);

    transform: translate(0%, 0%)

  }

}



/*

 ** landscape対策

 **/

@media (orientation: landscape) and (max-width: 896px) {

  .main {

    width: 96%;

    margin: 0 auto;

  }



  .sub {

    display: none;

  }



  .mv {

    /* height: 230vh; */

  }



  .main {

    margin: 0;

  }



  .mainCaution__body {

    display: block;

  }



  .mainCaution__item {

    width: 100%;

    min-width: 38rem;

    margin-bottom: 1rem;

  }



  .schedule__linkArea .c_icon {

    display: none;

  }

}





/*-----------------------------------------------

* btn, icon

-------------------------------------------------*/

.icon_arrow {

  position: absolute;

  top: 50%;

  right: 1.75vw;

  transform: translateY(-50%);

  z-index: 1;

  -webkit-transition: all .3s;

  transition: all .3s

}



.icon_arrow::before {

  background-color: var(--color-main)

}



.btn_pink .icon_arrow::before {

  background-color: #FFF;

}



@media screen and (min-width: 769px) {

  .icon_arrow::before {

    width: 2rem;

    height: 2rem

  }

}



@media screen and (max-width: 768px) {

  .icon_arrow {

    width: 18px;

    height: 18px;

  }

  .icon_arrow::before {

    width: 18px;

    height: 18px

  }

}





/* common_btnLink */

.common_btnLink {

  position: relative;

  max-width: 48rem;

  padding: 1rem 0;

  display: block;

  border: 4px solid;

  background-color: #fff;

  font-size: 16px;

  font-weight: 600;

  color: var(--color-main);

  text-align: center;

  letter-spacing: .1em;

  margin: 2rem auto;

}



.common_btnLink.btn_pink {

  border: none;

  background-color: var(--color-accent);

  color: #FFF;

}



.common_btnLink.btn_pink:hover {

  color: #fff;

}



.common_btnLink:hover .c_icon.icon_arrow {

  right: 1.5vw

}



.common_btnLink:hover .c_icon.icon_arrow::before {

  background-color: #fff

}



@media screen and (max-width: 768px) {

  .common_btnLink {

    border: 2px solid;

    border-color: var(--color-main);

    padding: .8rem 0;

    font-size: 1.3rem

  }

}



/*-----------------------------------------------

* utility

-------------------------------------------------*/

.bg_pink {

  background-color: var(--color-accent);

}



.text_pink {

  color: var(--color-accent);

}



.is-hidden {

  overflow: hidden;

}