@charset "utf-8";
/*--------------------------------------------

	 OVER 1920px

--------------------------------------------*/
@media all and (min-width : 1921px ){
}
/*--------------------------------------------

	 C__INNER WIDTH

--------------------------------------------*/
@media all and (max-width : 1320px ){
  /*--------------------------------------------
  	 BASE
  --------------------------------------------*/
  body {
    font-size: clamp(1.4rem,1.21vw,1.6rem);
  }
  /*--------------------------------------------
  	 COMMON
  --------------------------------------------*/
  .c__head{
    font-size: clamp(24px,2.27vw,30px);
  }
  .c__loop{
    font-size: clamp(97px,14.24vw,188px);
  }
  /*--------------------------------------------

  	 HEADER

  --------------------------------------------*/
  .header__inner{
  	padding-left: 3%;
  	padding-right: 1.67%;
  }
  .header__logo{
  	width: 68px;
  }
  .global__navi-list{
    font-size: 13px;
  }
  .global__navi-item + .global__navi-item{
  	margin-left: 1.6em;
  }
  .header__sns-item{
  	width: 2.2em;
  }
  .header__btn-item{
  	font-size: 12px;
  }
  #wrapper{
  	padding-top: 61px;
  }
  /*--------------------------------------------
  	 SERVICE
  --------------------------------------------*/
  .top__service-item_num{
    font-size: 27vw;
  }
  /*--------------------------------------------
  	 PHOTO
  --------------------------------------------*/
  .top__photo-list{
  	width: 110vw;
  	padding-top:38.65vw;
  	margin-right: 5.32vw;
  }
}
/*--------------------------------------------

	 TABLET

--------------------------------------------*/
@media all and (max-width : 1024.9999px ){
  body {
    font-size: 14px;
  }
  /*--------------------------------------------
     COMMON
  --------------------------------------------*/
  .c__head{
    font-size: 24px;
  }
  .c__btn + .c__btn{
    margin-left: 0;
    margin-top: 1.875em;
  }
  /*--------------------------------------------
     HEADER
  --------------------------------------------*/
	.drawer-hamburger{
		width: 4.2vw;
		padding: 10px 10px calc(1.067vw + 12px);
	}
	.drawer--right .drawer-hamburger{
    right: 16px;
    top: 14px;
		transform: none;
	}
	.drawer-hamburger-icon{
		margin-top: 1.067vw;
	}
  .drawer--right.drawer-open .drawer-hamburger {
    right: 16px;
  }
	.drawer-hamburger-icon:before{
		top: -1.067vw;
	}
	.drawer-hamburger-icon:after{
		top: 1.067vw;
	}
	.drawer--right .drawer-nav{
		right: -100%;
	}
	.drawer-nav{
		width: 100%;
    box-sizing: border-box;
    background:url(../Image/drawer__bg.png) center no-repeat;
    background-size: cover;
	}
  .drawer__inner{
    padding-bottom: 9.86%;
    border-bottom: 12px solid #111;
}
  .drawer__inner > *{
    position: relative;
    z-index: 2;
  }
  .drawer__logo{
    padding: 25px 5.3% 21px;
    background-color: #fff;
  }
  .drawer__logo-img{
    width: 68px;
  }
  .global__navi-list{
    font-size: 14px;
    letter-spacing: 0.08em;
    margin-top: 2.78em;
    padding:0 5.3%;
  }
  .global__navi-item + .global__navi-item {
    margin-left: 0;
  }
  .global__navi-link{
    padding:1.56em 0 1.5em;
    border-bottom: 1px solid #D0D0D0;
  }
  .header__sns-list{
    margin-left: 0;
    padding: 0 5,3%;
    margin-top: 9.6%;
    justify-content: center;
  }
  .header__sns-item{
    width: 3.346em;
  }
  .header__sns-item + .header__sns-item {
      margin-left: 1.24em;
  }
  .header__btn-list{
    padding:0 5.3%;
    margin-left: 0;
    margin-top: 2.11em;
    flex-direction: column;
  }
  .header__btn-item{
    font-size: 13px;
  }
  .header__btn-item + .header__btn-item{
    margin-left: 0;
    margin-top:1em;
  }
  .header__btn-link{
    width: 23em;
    box-sizing: border-box;
    text-align: center;
    background: url(../Image/icon__arrow-right_black.svg) right 1.92em center no-repeat var(--color-white);
    background-size: 0.384em;
    padding: 0.97em 1em;
    padding-right:1.5em;
  }
  .drawer__typography{
    font-size:20vw;
    color:#f4f4f4;
    line-height:	1.02;
  	writing-mode:vertical-rl;
    position: absolute;
    top: 0.64em;
  	right: -0.08em;
    white-space: nowrap;
    z-index: 1;
  }
  /*--------------------------------------------
  	 MV
  --------------------------------------------*/
  .top__mv-copy_sub{
    font-size: clamp(13px,1.25vw,24px);
  }
  /*--------------------------------------------
  	 BANNER
  --------------------------------------------*/
  .top__banner-item{
  	width: 47.2%;
  }
  .top__banner-item + .top__banner-item{
  	margin-left: 0;
  }
  .top__banner-item:nth-child(2n){
  	margin-left: 5.6%;
  }
  .top__banner-item:nth-child(n+3){
  	margin-top: 5.6%;
  }
  /*--------------------------------------------
  	 ABOUT
  --------------------------------------------*/
  .top__about{
  	padding-top: 18.75%;
  	padding-bottom: 19%;
  }
  .top__about-figure_label{
    font-size: clamp(56px,5.7vw,76px);
    left: -0.4em;
  }
  /*--------------------------------------------
  	 SERVICE
  --------------------------------------------*/
  .top__service{
  	padding-top: 16.8%;
  	padding-bottom: 16.3%;
  	background-size: 100vw;
  }
  .top__service:before,
  .top__service:after{
  	width: 100%;
  	background-size: 100%;
  }
  .top__service:before{
  	padding-top: 3.02%;
  }
  .top__service:after{
    padding-top: 2.86%;
  }
  .top__service-inner{
    padding:0 5%;
  }
  .top__service-feature{
  	margin-bottom: 11.71%;
    display: block;
  }
  .top__service-feature_figure{
  	width: 100%;
  }
  .top__service-feature_label{
  	font-size: 14px;
  }
  .top__service-feature_text{
  	margin-top: 5.5%;
    margin-left: 0;
  }
  .top__service-feature_lead{
  	font-size: 22px;
  }
  .top__service-feature_plane .c__plane{
  	font-size: 13px;
  }
  .top__service-feature_cursive{
  	width: 46%;
    max-width: 224px;
  	transform: translate(17%,80%);
  }
  .top__service-item + .top__service-item{
  	margin-top:8.78%;
  }
  .top__service-item_inner,
  .top__service-item:nth-of-type(2n) .top__service-item_inner{

  	flex-direction: column-reverse;
  }
  .top__service-item_text{
  	padding:0;
    margin-top: 1.5em;
    display: block;
  }
  .top__service-item_head{
  	font-size: 22px;
  }
  .top__service-item_num{
  	display: none;
  }
  .top__service-item_figure{
  	width: 100%;
  }
  /*--------------------------------------------
  	 MENU
  --------------------------------------------*/
  .top__menu{
  	padding-top: 17.57%;
  }
  .top__menu-box{
  	margin-top: 5%;
    display: block;
    padding-left: 8%;
    padding-right: 8%;
  }
  .top__menu-list:nth-child(1),
  .top__menu-list:nth-child(2){
    width: 100%;
    padding:0;
  }
  /*--------------------------------------------
  	 PHOTO
  --------------------------------------------*/
  .top__photo{
  	padding-top: 13.18%;
  	padding-bottom: 14.16%;
  }
  .top__photo-list{
  	width: 188vw;
  	padding-top:63vw;
  	margin-right: 9vw;
  }
  /*--------------------------------------------
  	 RESERVATION
  --------------------------------------------*/
  .top__reservation{
  	padding: 11.71% 0;
  }
  .top__reservation-btns{
  	flex-direction: column;
    align-items: center;
  }
  /*--------------------------------------------
  	 GALLERY
  --------------------------------------------*/
  .top__gallery{
  	padding-top: 14.64%;
  	padding-bottom: 16.6%;
  	background-size: 100vw;
  }
  .top__gallery-list{
  	margin-top: 5%;
  }
  .top__gallery-item{
  	width: 22.9%;
  }
  .top__gallery-item:not(:nth-child(6n+1)){
  	margin-left: 0;
  }
  .top__gallery-item:not(:nth-child(4n+1)){
  	margin-left: 2.8%;
  }
  .top__gallery-item:nth-child(n+5){
  	margin-top: 2.8%;
  }
  /*--------------------------------------------
  	 INFORMATION
  --------------------------------------------*/
  .top__information{
  	padding-top: 12.89%;
  	padding-bottom: 30.56%;
  }
  .top__information-inner{
  	padding-left: 5%;
  	padding-right: 5%;
  }
  .top__information-flex{
  	display: block;
  	margin-top: 6%;
  }
  .top__information-text{
  	padding-left: 0;
  	padding-right: 0;
  	display: block;
  }
  .top__information-list{
  	max-width: 100%;
  }
  .top__information-map{
  	width: 100%;
    margin-top: 8%;
  }
  .top__information-map .c__map{
  	padding-top: 53.7%;
  }
  .top__information-note{
  	margin-top: 8%;
  }
  .top__information-note_head{
  	font-size: 19px;
    text-align: left;
  }
  .top__information-note_flex{
  	display: block;
  }
  .top__information-note_list{
  	font-size: 13px;
  	max-width: 100%;
  }
  .top__information-note_list + .top__information-note_list{
  	margin-left:0;
    margin-top: 0.9em;
  }
  /*--------------------------------------------
  	 CV
  --------------------------------------------*/
  .top__cv .c__btn + .c__btn{
  	margin-left: 0;
  }

  /*--------------------------------------------
  	 FOOTER
  --------------------------------------------*/
  .footer__flex{
  	display: block;
  }
  .footer__info-logo{
  	width: 68px;
  }
  .footer__info-address{
  	font-size: 13px;
  	margin-top: 1.6em;
  }
  .footer__nav{
    padding-left: 0;
    padding-top: 2.4em;
  }
  .footer__nav-list{
  	display: block;
  	font-size: 13px;
  }
  .footer__nav-item +.footer__nav-item{
    margin-top: 1.2em;
    margin-left: 0;
  }
  .footer__bottom{
  	text-align: center;
  	font-size: 11px;
  }
}
/*--------------------------------------------

	 MOBILE

--------------------------------------------*/
@media all and (max-width : 683.9999px ){
  body {
  	font-size: 1.3rem;
  }
  .c__inner{
  	padding:0 5.3%;
  }
  .c__head-en{
  	font-size: 0.6em;
  }
  .c__head-ja{
  	letter-spacing: 0.14em;
    line-height: 1.54;
    margin-top: 0.5em;
  }
  .c__btn + .c__btn{
    margin-top: 1.25em;
  }
  .c__btn-link{
    font-size: 12px;
    letter-spacing: 0.04em;
  }
  .c__loop{
  	font-size: 19.46vw;;
  }
  .for_pc{
    display: none;
  }
  /*--------------------------------------------
  	 HEADER
  --------------------------------------------*/
  .header{
  	padding:12px 0 10px;
  }
  .header__logo{
  	width: 43.6px;
  }
  .drawer--right .drawer-hamburger{
    right: 0;
    top: 0;
    padding:13.5px 17.5px 19.5px;
    width: 16px;
  }
  .drawer--right.drawer-open .drawer-hamburger{
    right: 0;
  }
  .drawer-hamburger-icon{
    margin-top: 6px;
  }
  .drawer-hamburger-icon:before{
    top: -6px;
  }
  .drawer-hamburger-icon:after{
    top: 6px;
  }
  .drawer__logo{
    padding: 12px 5.3% 10px;
  }
  .drawer__logo-img{
    width: 43.6px;
  }
  #wrapper{
  	padding-top: 38.2px;
  }
  /*--------------------------------------------
  	 MV
  --------------------------------------------*/
  .top__mv{
  	padding-top:14.1%;
  	padding-bottom:14.1%;
  	background-image:url(../Image/top__mv-bg_sp.png);
  }
  .top__mv-inner{
  	display: block;
  }
  .top__mv-copy{
  	width: 100%;
  	padding-left:0;
  	padding-right:0;
  }
  .top__mv-copy_main{
  	font-size: 7.6vw;
  	letter-spacing: 0.24em;
  }
  .top__mv-copy_sub{
    font-size: clamp(11.5px,3.067vw,13px);
  	letter-spacing: 0.16em;
  	line-height: 2.34;
  	margin-top: 1.8em;
  }
  .top__mv-figure{
    margin-top: 7.73vw;
  	width: 100%;
  	padding-right: 0;
  }
  .top__mv-scroll{
    display: none;
  }
  .top__mv-round{
  	width: 26.8%;
  	right: 5.3%;
  	top: 4%;
  }
  .top__mv-typography{
  	font-size: 14.2vw;
  	line-height:	0.98;
  	right: 3.2%;
    bottom: initial;
    top: 22.1%;
  }

  /*--------------------------------------------
  	 BANNER
  --------------------------------------------*/
  .top__banner{
  	padding-top: 9.3%;
  }
  /*--------------------------------------------
  	 ABOUT
  --------------------------------------------*/
  .top__about{
    padding-top: 23.4%;
  	padding-bottom:20.6%;
  }
  .top__about-typography{
    display: none;
  }
  .top__about-figure_label{
    font-size: 6.67vw;
  	line-height: 1.16;
  	top: -1.32em;
  }
  .top__about-text{
  	margin-top: 10.4%;
  }
  .top__about-plane{
  	margin-top: 1.6em;
    text-align: left;
  }
  .top__about-plane .c__plane{
  	line-height: 2.61;
  }
  /*--------------------------------------------

  	 SERVICE

  --------------------------------------------*/
  .top__service{
  	padding-top: 15.7%;
  	padding-bottom: 19.72%;
  }
  .top__service:before{
  	background-image: url(../Image/top__service-bg_top-sp.svg);
    padding-top: 7.6%;
  }
  .top__service:after{
  	background-image: url(../Image/top__service-bg_bottom-sp.svg);
    padding-top: 7.138%;
  }
  .top__service-body{
  	margin-top: 4.78%;
  }
  .top__service-feature{
  	margin-bottom: 14.9%;
  	padding: 13.58% 12.8% 14.9%;
  }
  .top__service-feature_label{
    font-size: 2.66vw;
  	/* line-height: 1.7;
  	width: 8.1em;
  	height: 8.1em; */
  	transform: translate(-25.3%, -8.64%);
  }
  .top__service-feature_text{
    margin-top: 5.84%;
  }
  .top__service-feature_lead{
    font-size: 19px;
  }
  .top__service-feature_plane{
  }
  .top__service-feature_plane .c__plane{
  	font-size: 12px;
  	line-height: 2.25;
  	letter-spacing: 0.06em;
  	margin-top: 1.33em;
  }
  .top__service-feature_cursive{
  	width: 46.4%;
  	transform: translate(18.3%,85%);
  }
  .top__service-item + .top__service-item{
  	margin-top:12.5%;
  }
  .top__service-item_inner,
  .top__service-item:nth-of-type(2n) .top__service-item_inner{
    flex-direction: column-reverse;
  }
  .top__service-item_text{
    margin-top: 1.42em;
  }
  .top__service-item_head{
  	font-size: 21px;
  }
  .top__service-item_head .c__head-ja{
  	letter-spacing: 0.1em;
  	margin-top: 0.12em;
  }
  .top__service-item_plane{
  	letter-spacing: 0.06em;
  	margin-top: 1.15em;
  }
  .top__service-item_img{
  }
  /*--------------------------------------------
  	 MENU
  --------------------------------------------*/
  .top__menu{
    padding-top: 25.6%;
  }
  .top__menu-box{
  	padding: 0.8em 7.16% 2.6em;
    margin-top: 6.12%;

  }
  .top__menu-list{
  	flex:1;
  }
  .top__menu-item{
    font-size: 12px;
  	padding-bottom: 0.8em;
  }
  .top__menu-value{
  	font-size: 1.1667em;
  	padding-right: 0;
  }
  .top__menu-note{
  	font-size: 10px;
  }
  /*--------------------------------------------
  	 RESERVATION
  --------------------------------------------*/
  .top__reservation{
    padding: 24.5% 0 33.7%;
  	background-image:url(../Image/top__reservation-bg_sp.jpg);
  }
  .top__reservation-plane{
    font-size: 12px;
  	margin-top: 1.3em;
  	letter-spacing: 0.06em;
  }
  .top__reservation-btns{
  	margin-top: 3em;
  }
  #top__reservation2{
    display: none;
  }
  /*--------------------------------------------
  	 GALLERY
  --------------------------------------------*/
  .top__gallery{
  	background-image:url(../Image/top__gallery-bg_sp.png);
    padding-top: 16%;
  	padding-bottom: 24.2%;
  	background-size: contain;
  }
  .top__gallery-list{
    margin-top: 9.25%;
  }
  .top__gallery-item{
    width: 30%;
  }
  .top__gallery-item:not(:nth-child(4n+1)){
    margin-left: 0;
  }
  .top__gallery-item:not(:nth-child(3n+1)){
    margin-left: 5%;
  }
  .top__gallery-item:nth-child(n+4){
  	margin-top: 5%;
  }
  .top__gallery-btn{
  	margin-top: 3.8em;
  }
  /*--------------------------------------------
  	 INFORMATION
  --------------------------------------------*/
  .top__information{
    padding-top: 24.26%;
  	padding-bottom: 35.73%;
  }
  .top__information-loop{
  	padding-bottom: 0.459em;
  }
  .top__information-flex{
  	margin-top: 2%;
  }
  .top__information-item{
  	line-height: 1.46;
  	padding:1.84em 0;
  }
  .top__information-label{
  	width: 6.3em;
  	padding-right: 1.2em;
  }
  .top__information-map{
    margin-top: 9%;
  }
  .top__information-note{
    margin-top: 10.4%;
  	padding: 10.2% 7.6%;
  }
  .top__information-note_head{
  	letter-spacing: 0.1em;
  	margin-bottom: 0.92em;
  }
  .top__information-note_list{
  	letter-spacing: 0.06em;
    font-size: 12px;
  }
  /*--------------------------------------------
  	 CV
  --------------------------------------------*/
  .top__cv{
  	background-image: url(../Image/top__cv-bg_sp.jpg);
  }
  /*--------------------------------------------
  	 TOTOP
  --------------------------------------------*/
  .totop{
    display: none;
  }
  /*--------------------------------------------
  	 FOOTER
  --------------------------------------------*/
  .footer__top{
    padding-top:26.2%;
  	padding-bottom: 28.1%;
  }
  .footer__info-logo{
  	width: 16vw;
  }
  .footer__info-address {
      font-size: 12px;
  }
  .footer__nav {
    padding-top: 3em;
  }
  .footer__nav-list {
    font-size: 15px;
  }
  .footer__bottom{
    font-size: 10px;
    padding: 1.4em 0;

  }
}