@charset "utf-8";
/* CSS Document */
/*---------------------------------------1400--------------------*/
@media screen and (max-width:1400px){
.d_m_gallery {
	width: 1170px;
	height: auto;
}
#coaster {
    width: 82%;
}
#coaster::after {
  border-image-slice: 150;
}
}
/*---------------------------------------1200--------------------*/
@media screen and (max-width:1200px){
.main-chara {
  width: 100%;
	margin: 0 auto;
}
.main-img {
    margin: -42% auto;
	width: 100%;
}
  .flagL {
  width: 45%;
  left: -15%;
}
.flagR {
  width: 45%;
  right: -15%;
}
main .w_inner {
	max-width: 90%;
	margin: 0 auto;
}
#about,#menu,#h-menu {
    width: 80%;
	}
.price li {
  width: 45%;
}
.line_btn {
  padding: 0.5em 1.5em;
  width: 80%;
}
.sp_img {
  width: 45%;
}
.sp_menu {
  width: 70%;
}
.sp_read {
}
.tab_img {
    width: 90%;
}
.tab_list {
    width: 100%;
    padding-left: 6%;
    padding-bottom: 2%;
}  
.story-inner {
    width: 55%;
}
.yoyaku_btn {
  width: 19%;
  bottom: 6%;
}
.gotop {
  width: 13%;
}
  .nav-inner {
    width: 85%;
}
  .d_m_title{
    width: 120%;
    max-width: none;
    margin-left: -7%
  }
.d_m_gallery {
	width: 130%;
	height: 378px;
	margin-left: 104px;
}
	.d_m_box {
height: 68%;
}
#coaster {
        width: 54%;
	}
#coaster::after {
  border-image-slice: 152;
}
.coaster_inner {
  display: block;
}
.coaster_box {
  width: 100%;
  padding: 2%;
}
.coaster_img {
  width: 60%;
  margin: auto;
}
.coaster_read {
  margin-top: 0%;
  margin-left: 0%;
  line-height: 1.8em;
  text-align: center;
}
}
/*---------------------------------------900--------------------*/
@media screen and (max-width:900px){
#d_main {
	padding-bottom: 0;
}
h1 img{
  width: 100%;
}
  .flagL {
  width: 45%;
  left: -15%;
}
.flagR {
  width: 45%;
  right: -15%;
}
.top_main {
  width: 85%;
}
#nav.d_nav {
  top: 0!important;
}
.bg_parts1 {
  margin-bottom: -20%;
  margin-right: 5%;
  margin-top: 3%;
}
.bg_parts1 img {
  width: 18%;
}
  #about,#menu,#h-menu {
    width: 90%;
  }
.main-img {
    width: 100%;
    }
.main-img img {
    width: 100%;
    }
.t1 img{
  width: 65%;
    margin-left: 10%;
}
  .about_item,.gallery_item {
    width: 30%;
  }
  .about_item {
    margin-left: 86%;
    margin-top: -34%;
  }
#special {
  width: 90%;
}

.sp_area {
  border: rgba(255, 102, 157, 1) dotted 7px;
}
.sp_title {
  padding: 2% 0;
  font-size: 4em;
}
.sp_read {
  width: 95%;
}
.sp_img {
  width: 50%;
    margin: -1% 0;
}
.sp_menu {
  width: 70%;
}
.sp_menu_title {
  padding: 1% 0;
}
.sp_about {
  padding: 2%;
  text-align: center;
}
.sp_item {
    width: 30%;
    margin-left: 82%;
    margin-top: -34%;
}
.bg_parts2 img, .bg_parts3 img {
    width: 25%;
}  
.bg_parts2 {
    margin-bottom: -16%;
    margin-left: 0%;
    margin-top: -9%;
}  
.t2 img {
    width: 85%;
}  
.menu_read {
    width: 95%;
}  
.menu_title {
    width: 23%;
}
.d_m_gallery {
	width: 905px;
	height: 378px;
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	padding: 2% 4%;
    }
.gallery_item {
    margin-left: 83%;
    margin-top: -25%;
} 
.d_m_box {
	height: 95%;
	width: 39%;
    }
.bg_parts3 {
    margin-top: -20%;
    margin-right: 0%;
  margin-bottom: -3%;
}  
.story-inner {
    width: 65%;
}
.copy {
    width: 65%;
}  
.yoyaku_btn {
  width: 23%;
  bottom: 20%;
}
.gotop {
  width: 17%;
}
.d_about,.d_about,.d_menu,
.d_h-menu,.d_story,.d_info {
	top: 0;
}
  .d_m_title{
    width: 130%;
    margin-left: -11%
  }
#coaster {
        width: 60%;
    }
#coaster::after {
        border-image-slice: 133;
    }
}
/*---------------------------------------768--------------------*/
@media screen and (max-width:768px){
.pcHidden {
    display: block;
  }
.spHidden {
    display: none!important;
  }
main .text_14 {
	font-size: 0.7rem;
}
main .text_16 {
	font-size: 0.875rem;
}
main .text_18 {
	font-size: 1.2rem;
}
main .text_20 {
	font-size: 1.4rem;
}
main .text_24 {
	font-size: 1.8rem;
}
main .text_26 {
	font-size: 2rem;
}
main .text_28 {
	font-size: 2.2rem;
}
#d_main {
	position: relative;
	padding-bottom: 10rem;
	top: 307px;
}
.loading-img {
  width: 70%;
  margin-left: 13%;
}
.loader p {
  margin-left: 10%;
  }
.top_main {
  width: 100%;
}
  .flagL {
  width: 50%;
  left: -22%;
}
.flagR {
  width: 50%;
  right: -22%;
}
.main-img {
    width: 98%;
    }
.nav-inner {
  width: 100%;
  margin: 0 auto;
}
.read {
padding: 1% 3%;
text-align: left;
  }
.nav-btn {
  padding-top: 12%;
}
.nav-btn li {
  font-size: 1.6em;
}
.bg_parts1 {
  margin-bottom: -23%;
  margin-right: 3%;
}
.bg_parts1 img {
  width: 21%;
}
  #about,#menu,#h-menu {
    padding: 2% 0;
  }
.about-inner,.menu-inner,.hmenu-inner {
  width: 95%;
  }
  .about-area,.menu-area,.hmenu-area {
    width: 90%;
  }
.t1 img{
  width: 70%;
    margin-left: 5%;
}
  .about_item,.gallery_item {
    width: 35%;
  }
  .about_item {
    margin-left: 77%;
    margin-top: -42%
  }
  .sp_L {
    text-align: left;
  }
.sp_item {
    width: 38%;
    margin-left: 76%;
    margin-top: -40%;
}  
.bg_parts2 img, .bg_parts3 img {
    width: 30%;
}  
.bg_parts2 {
    margin-bottom: -16%;
    margin-top: -13%;
}  
.t2 img {
    width: 95%;
    margin-left: -3%;
}
.menu_read {
    width: 100%;
}
.gallery_item {
    margin-left: 79%;
    margin-top: -26%;
}  
.bg_parts3 {
    margin-top: -20%;
    margin-bottom: -7%;
}  
.story-inner {
    width: 75%;
}
.copy {
    width: 76%;
}  
.yoyaku_btn {
  bottom: 6%;
    width: 26%;
    right: -2%;
}
.gotop {
      width: 19%;
    right: 1%
}
.about-inner,.menu-inner,.hmenu-inner,.story-inner,.loader-bg {
  background-size: 50%;
}
.widelink__title {
    padding-left: 5%!important;
}  
  .menuIcon {
    display: none!important;
  } 
.d_nav {
  margin-top: 0!important;
}
  .d_m_title{
    margin-left: -16%
  }
.d_lantern {
  margin-left: -2%;
}
  .bnr_lunch{
	width: 100%;
    margin-bottom: 5%;
}
.d_m_gallery {
	width: 124%;
	height: 450px;
	margin-left: 19%;
}
  .d_mg_title{
	width: 400px;
	font-size: 100%;
  }

.d_m_box {
	width: 76%;
	height: 87%;
	margin-left: 5%;
  }
.box_photo li:nth-child(1) {
	top:20%;
	width: 85%;
	left: -5%;
  }
.box_photo li:nth-child(2) {
  position: absolute;
  top:46%;
  left: 40%;
  width: 58%;
  }
  .photo05 {
    top: 22%!important;
  }
  .photo06 {
    top: 10%!important;
    left: 55%!important;
    width: 42%!important;
}
.click {
  width: 8%;
}
  .d_t2 img{
        width: 100%!important;
    margin-left: 0!important;
    max-width: none;
  }
  #coaster {
    width: 70%;
	margin: 5% auto;
  }
#coaster::after {
	border-image-slice: 154;
}
.coaster_img {
  width: 75%;
}
  .menu_title {
  margin-top: 7%;
}
.d_info {
	padding-bottom: 20%!important;
}
}
/*---------------------------------------500--------------------*/
@media screen and (max-width:500px){
#d_main {
	position: relative;
	padding-bottom: 0;
	top: -70px;
}
.main-chara {
  width: 100%;
}
.main-img {
	margin: -42% auto -27%;
	padding: 1%;
}
.main-img img {
  width: 100%;
}
  .flagL {
  width: 60%;
  left: -36%;
}
.flagR {
  width: 60%;
  right: -36%;
}
.nav-btn li {
padding: 5px 25px 1px 25px
  }
.bg_parts1 {
  margin-bottom: -26%;
  margin-right: 0%;
}
.bg_parts1 img {
  width: 25%;
}
  .line_yoyaku {
    width: 70%;
  }
.price li {
  width: 100%;
	font-size: 1.2rem;
}
.t1 img{
  width: 80%;
    margin-left: 0%;
}
  .sp_L {
    text-align: left;
  }
  .about_item,.gallery_item {
    width: 40%;
  }
.about_item {
    margin-left: 73%;
    margin-top: -20%;
    margin-bottom: -31%;
    z-index: 100;
    position: relative;
}
  .sp_br {
    display: block;
  }
.sp_area {
  width: 95%;
  border: rgba(255, 102, 157, 1) dotted 6px;
}
.sp_title {
  font-size: 3.5em;
  padding-left: 5%;
}
.sp_img {
  width: 70%;
}
.sp_menu {
  width: 95%;
}
.sp_menu_title {
    padding: 1% 2%;
    text-align: left;
}
.sp_about {
  margin-top: -2px;
  text-align: left;
}
.sp_item {
    width: 41%;
    margin-left: 63%;
    margin-top: -41%;
    margin-bottom: -3%;
    z-index: 1000;
    position: relative;
} 
.t2 img {
    width: 100%;
    margin-left: -5%;
}
.bg_parts2 img, .bg_parts3 img {
    width: 34%;
}
.menu_title {
    width: 30%;
} 
.gallery_item {
    margin-left: 76%;
}  
.bg_parts3 {
    margin-top: -21%;
  margin-bottom: -9%;
}  
.tab li a {
    padding: 5px 15px;
}
.tab_list {
    padding-left: 0%;
}  
.tab_img {
    width: 100%;
}
.story-inner {
    width: 95%;
}
.d_story-inner {
	width: 100%;
}
.copy {
    width: 97%;
}  
.yoyaku_btn {
    bottom:17%;
    width: 34%;
    right: -2%;
}
.gotop {
      width: 25%;
}
.slick-slider {
    max-width: none;
    width: 136%;
    margin-left: -18%;
}
.slick-slide img {
    max-width: none;
    width: 100%;
} 
  .d_m_title{
    width: 140%;
    margin-left: -20%;
    padding-bottom: 5%;
  }
.d_lantern {
  margin-left: 0;
}
.d_m_gallery {
	width: 133%;
	height: 282px;
	margin-left: 14%;
}
.d_m_box {
	width: 63%;
	height: 90%;
	margin-left: 0;
}
.d_mg_title{
	width: 245px;
	font-size: 75%;
}
.box_photo li:nth-child(1) {
    top: 19%;
    width: 96%;
    left: 152px;
  }
.box_photo li:nth-child(2) {
    top: 33%;
    left: 19%;
    width: 73%;
  }
  .photo05 {
    top: 19%!important;
  }
  .photo06 {
top: 19%!important;
    left: 45%!important;
    width: 50%!important;
}
#coaster {
	width: 95%;
	margin: 10% auto;
	padding: 7%;
}
#coaster::after {
	border-image-slice: 100;
}
.coaster_img {
  width: 90%;
}
.images_item02 {
	border: 5px solid #fff;
}  
  .d_none {
  display: block;
}
.d_info {
        padding-bottom: 0!important;
    }
.d_read {
  text-align: left;
  padding-top: 6%;
}
}
/*---------------------------------------400--------------------*/
@media screen and (max-width:400px){
.main-chara {
  margin-left: 0;
  width: 100%;
}
  .flagL {
  width: 50%;
  left: -30%;
}
.flagR {
  width: 50%;
  right: -30%;
}
.nav-btn li {
padding: 5px 15px 0px 15px;
  font-size: 1.5em;
  }
.bg_parts1 {
  margin-bottom: -22%;
}
.bg_parts1 img {
  width: 28%;
}
.price li {
  width: 100%;
}
  .line_yoyaku {
    width: 98%;
  }
.t1 img{
  width: 90%;
}
  .about_item,.gallery_item {
    width: 45%;
  }
.about_item {
    margin-left: 67%;
    margin-top: -30%;
    margin-bottom: -28%;
}
  .none_br {
  display: block;
}
.sp_area {
  border: rgba(255, 102, 157, 1) dotted 5px;
}
.sp_title {
  font-size: 3em;
}
.sp_img {
  width: 80%;
}
.sp_item {
    width: 46%;
    margin-left: 61%;
    margin-top: -41%;
    margin-bottom: -3%;
}  
.bg_parts2 img, .bg_parts3 img {
    width: 37%;
}
.bg_parts2 {
    margin-top: -16%;
}  
.t2 img {
    width: 110%;
    max-width: none;
    margin-left: -9%;
}
.menu_title {
    width: 35%;
}
.gallery_item {
    margin-left: 72%;
}
.bg_parts3 {
    margin-top: -21%;
  margin-bottom: -11%;
}  
.area {
    padding: 10px 5px;
}
.tab li a {
    margin: 0px 1px;
    padding: 0px 5px;
}  
.yoyaku_btn {
        bottom: 6%;
    width: 40%;
    right: -3%;
}
.gotop {
      width: 30%;
}
  .d_m_title{
    width: 150%;
    margin-left: -25%;
    padding-bottom: 10%;
  }
.d_lantern {
  margin-left: 0%;
  margin-top: -6%;
}
  .d_m_gallery {
	width: 365px;
    height: 420px;
  }
  	.d_m_box {
height: 100%;
}
    .d_mg_title{
    width: 342px;
	font-size: 100%;
  }
.box_photo li:nth-child(1) {
	top: 24%;
    width: 100%;
    left: -7%;
  }
.box_photo li:nth-child(2) {
	top: 28%;
    left: 0%;
    width: 100%;
  }
  .photo05 {
    top: 25%!important;
  }
  .photo06 {
top: 23%!important;
    left: 43%!important;
    width: 55%!important;
}  
.click {
  width: 13%;
}
.coaster_img {
  width: 100%;
}  
.images_item02 img {
}
#coaster::after {
        border-image-slice: 141;
    }  
}
