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

html,body{overflow-x:hidden;}

#container{
	font-family: 'Noto Sans JP', sans-serif;
    width: 100%;
    margin: 0;
	font-size: 16px;
	color: #000;
	line-height: 1.5;
	padding-bottom: 7em;
}
*{box-sizing: border-box;}
th{font-family: 'Noto Sans JP', sans-serif;}
.w1000{
	width: 1000px;
	margin: 0 auto;
}

#container img {
	margin:0;
	padding:0;
	vertical-align:bottom;
	
	width: 100%;
	max-width: 100%;
}
#container a, #container a:link{color: #000; text-decoration:none;}
#container a:hover{		cursor: pointer;	/*opacity: .7;*/}
/*th {	font-family:'メイリオ', 'Meiryo', 'Helvetica', 'ヒラギノ角ゴシック ProN', 'Arial', 'ＭＳ Ｐゴシック',sans-serif;}*/
/*#container:after, .content:after, .inner:after, dl:after,.clearfix:after{display: none;}*/

.sp,.sp_only{display: none;}
.flex_box{	display: flex;}
/*.hina{font-family: 'Hina Mincho', serif;}
.min{font-family: 'Noto Serif JP', serif;}*/
.sans{font-family: 'Noto Sans JP', sans-serif;}
.kai{font-family: 'Kaisei Tokumin', serif;} /*400,500*/
.kiwi{font-family: 'Kiwi Maru', serif;} /*300,400,500*/
.sans{font-family: 'Noto Sans JP', sans-serif;} /*300,400,700*/
.s_font{font-size: 0.9em; line-height: 1.2;}
.red{color: #D40000;}
/*-----------------------pagetop*/

#pagetop {
	position: fixed;
	bottom: 1em;
	right: 1em;
	z-index:50;
	width:4em;
	height:4em;
	border-radius:50%;
	overflow:hidden;
	text-align: center;
}
#pagetop a {
	position: relative;
	display:block;
	width:100%;
	height:100%;
	padding:0;
	background-image: none;
	background-color:rgba(170,8,11,0.40);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;	
}
#pagetop a:before{
	content: "▲";
	display: block;
	position: absolute;
	color: #FFF;
	font-size: 2em;
    text-indent: 0;
	left: 50%;
	top: 50%;
	transform: translateY(-50%) translateX(-50%);
}
#pagetop a:hover {
	text-decoration: none;
	background-color: #a5a5a5;
}
/*--------------------パンくず */
#pankuzu{
	margin: 15px auto;
	width: 1000px;
	font-size: .85em;
}

#pankuzu ul{
    padding: 0 0 5px;
    _zoom: 1;
}
#pankuzu li{
    float: left;
    list-style: none;
}
#pankuzu li + li:before{
    margin: 0 8px;
    content: '>';
}

/*------------------------------------------------------------------------------------------------------------ main */
/*------------------------------title*/
#title{
/*	background:url("../img/title_bg.jpg") repeat-x center top;*/
	background:#f4bd2f;
	max-height: 436px;	
}

#title h1{
    max-width: 1486px;
    padding: 27% 0 0;
	margin: auto;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 100%;
    background: url("../img/title.png") no-repeat;
    background-size: 100%;
}
#title + p{
	font-family: 'Zen Maru Gothic', serif;
	font-weight: 500;
	text-align: center;
	font-size:min(2.5vw,1.8em);	

	color:#d99c00;
	padding:1em;
}
/*------------------------------nav */
nav{background: #F3F3F3;}
nav ul{
	padding: 2em 0;
	display: flex;
	justify-content: center;
}
nav ul li{
	margin: 1em;
	text-align: center;
	position: relative;
	font-family: 'Zen Maru Gothic', serif;
}
nav ul li a {
	color: #003a75!important;
	font-size:min(1.8vw,1.3em);
    transition: 0.3s ease-in-out;
    font-weight: 600;
	padding: .5em 1em;
}

nav ul li a {
  background: 
      linear-gradient(currentColor 0 0) 
      bottom /var(--d, 20%) 3px 
      no-repeat;
  transition:0.5s;
}
nav ul li a:hover {
  --d: 100%;
}

/*------------------------------------------------------------------------------------------------------------ common */
section:not(#title){
    padding: 2em 0;
}
h2{
	font-size: 1.5em;
	text-align: center;
	font-weight: 900;
	margin: 3em auto 1em;
}
h2 span{
	color: #f5be30;
	font-size: 2em;
	display: block;
	padding-bottom: .3em;
	line-height: 1;
}
h2 strong{
	font-family: 'Zen Maru Gothic', serif;
	color: #003a75;
}
h2 strong::before{
	content: url(../img/h2_left.png);
  vertical-align: middle;
  padding-right: 10px;
}
h2 strong::after{
	content: url("../img/h2_right.png");
  vertical-align: middle;
  padding-left: 10px;
}
h2 + p{
	text-align: center;
	font-weight: bold;
	font-size: 1.3em;
	line-height: 1.7;
	margin-bottom: 2em;
	
font-family: 'Kiwi Maru', serif;
}
#container .btn a{transition-duration: 0.5s;}
#container .btn a:hover{
	transform: rotateX( 360deg );
	transition-duration: 0.5s;
}
.photo{	position: relative;}
.photo .cre{
	line-height: 1.1;
	font-size: .65em;
	position: absolute;
	left:1%;
	bottom:1%;
	color: #fff;
	text-shadow    : 
       1px  1px 1px #000,
      -1px  1px 1px #000,
       1px -1px 1px #000,
      -1px -1px 1px #000,
       1px  0px 1px #000,
       0px  1px 1px #000,
      -1px  0px 1px #000,
       0px -1px 1px #000;
}

/*------------------------------------------------------------------------------------------------------------ #fun */
#fun{	
	background: repeating-linear-gradient(90deg, #f6f6f6, #f6f6f6 10px, #fbfbfb 10px, #fbfbfb 20px);
}
#fun img {
	width: auto;
	max-width: 100%;
}
#fun h2 +p{	font-size: min(4.2vw,1.3em);}
#fun h2 +p small{
	font-size: .7em; 
	text-align: left;
}
.fun02{	
	background: url(../img/fun02.png) no-repeat left top / contain,#d9e9f5;
}
.fun02 .number{
	background: #1F3176;
	color: #fff;
	font-size: 1.2em;
	padding: 2px .5em;
	display: inline-block;
	font-weight: 800;
}
.fun02 h3{
	justify-content: center;
	align-items: center;
	font-size: 1.5em;
	font-weight: 800;
	margin: .7em auto 1.5em;
	text-shadow    : 
       2px  2px 1px #d9e9f5,
      -2px  2px 1px #d9e9f5,
       2px -2px 1px #d9e9f5,
      -2px -2px 1px #d9e9f5,
       2px  0px 1px #d9e9f5,
       0px  2px 1px #d9e9f5,
      -2px  0px 1px #d9e9f5,
       0px -2px 1px #d9e9f5;	
}
.fun02 h3 strong{
	font-size: 2.2em;
	font-weight: 900;
}
.fun02 h3 span{width: 30%;}
.fun02 dl{
	background: #fff;
	box-shadow: 2px 2px 3px #111;
	padding: 0 1.5em .5em;
	max-width: 80%;
	margin: auto;
}
.fun02 dl .ribbon{
	background: #de2633;
	color: #fff;
	padding: .1em .3em;
	display: inline-block;
	font-weight: 600;
	transform: rotate(-5deg);
/*	margin-left:25%;*/
/*	text-align: left;	*/
	font-size: .85em;
	position: absolute;
}
.fun02 dl dt{
	margin-top: -25px;
	font-weight: 900;
	text-align: center;
}
.fun02 dl dt span{font-size: 1.5em; color: #de2633; margin-left: .3em;}
.fun02 dl dt strong{font-size: 1.8em;}
.fun02 dl dt small{	display: block;}
.fun02 dl .s_font{margin: 1em 3em;}

/*-------------------------------8月号*/
.fun08{	
	background: 
		url(../img/fun08-1.png) no-repeat left top / contain,
		url(../img/fun08-2.png) no-repeat right top / contain,
		#d9e9f5;
}
.fun08 h3{
	flex-wrap: wrap;
	text-shadow    : 
       2px  2px 1px #fff,
      -2px  2px 1px #fff,
       2px -2px 1px #fff,
      -2px -2px 1px #fff,
       2px  0px 1px #fff,
       0px  2px 1px #fff,
      -2px  0px 1px #fff,
       0px -2px 1px #fff;
	text-align: center;
	margin-top: -2.5em;
}

.plan{
	display: flex;
	max-width: 1500px;
	margin: auto;
}
.zurasshi-box{
    position: relative;
    background-color: #FFFFFF;
	border: #969696 1px solid;
    margin: 0 .7em 1.5em;
    display: flex;
    flex-direction: column;
	
	flex: 1;
}
#fun .zurasshi-box dt span img{width: 4em; margin-right: 1em; vertical-align: middle;}
.zurasshi-box dt{
	font-size:min(3vw,33px);
	line-height: 1.3;
	font-weight: bold;
	padding: .5em .5em .5em 4em;
}
.zurasshi-box .area{
	position: absolute;
	top:.8em;
	left:.5em;
	background: #f5be30;
	font-size: 1.5em;
	padding:4px .5em;
	text-align: center;
	line-height: 1.4;
}
.zurasshi-box .ticket{text-align: center; margin-bottom: 1em;}
.zurasshi-box .ticket span{
	border: #00C3FF 2px solid;
	padding: 2px .5em;
	margin: .5em;
	background: #fff;
	font-size:clamp(11.5px, 1.3vw, 20px);
}
.zurasshi-box .image{
	flex: 1;
	position: relative;
}
.zurasshi-box .image span{
	position: absolute; 
	top: 0; 
	left: 0;
	background: rgba(0,0,0,0.55);
	color: #fff;
	font-size: .75em;
	padding: 0 .3em;
}
.zurasshi-box .ex{
	flex: 1;
	padding: 0 1em;
	line-height: 1.3;
	font-size: .95em;
	font-weight: 400;
	position: relative;
	flex-grow: 1;
	min-height: 100px;
	padding-bottom: 2em;
	text-align: center;
}
#fun .zurasshi-box .ex span img{
	max-width: 4em;
	margin-right: .7em;
	margin-bottom: -.3em;
}
.zurasshi-box .ex span{
	display: block;

	background: #C3E2F3;
	padding: 0.2em .5em;
	font-weight: 800;
	margin-bottom: .5em;
	vertical-align: middle;
}
.zurasshi-box .ex::after{
	content: "プランはこちら";
	position: absolute;
	bottom:.5em;
	right: 1em;
	color: #E09F13;
	border-bottom: 2px solid #E09F13;
	font-weight: 600;
}
.zurasshi-box a{	
	display: block;
}
.zurasshi-box a:hover,.plan-box:hover{	background: #FBF7E3;}

.zurasshi-box table{width: 100%; margin-top: .7em;}
.zurasshi-box table th,
.zurasshi-box table td{
	border: 1px #646464 solid;
	text-align: center;
}
.zurasshi-box table th{	background: #E4EBF1;}
.zurasshi-box table td{	background: #fff;}
.zurasshi-box table th:first-of-type{
	width: 44%;
}
.zurasshi-box table th:not(first-of-type),
.zurasshi-box table td{
	width: 28%;
}


.btn{	
	border-bottom: #00a6ff 5px solid;
	line-height: 1;
	width: 30em;
	margin: .5em auto 2em;
	text-align: center;
}
.btn a{
	display:block;
	font-size:min(5vw,21px);
	font-weight: 800;
	padding: .5em 1em;

/*	background: #00a6ff;
	color: #fff!important;*/
}
/*-------------------------------hotel */
#slick01-3{
	display: flex;
	flex-wrap: wrap;
	max-width: 1500px;
	margin: auto;
}
.hotel-box{
    position: relative;
    background-color: #FFFFFF;
	border: #969696 1px solid;
    margin: 0 .7em 1.5em;
    display: flex;
    flex-direction: column;
	
	flex: 30%;
	width: 30%;
}
/*.hotel-box dl{flex-grow: 1;}*/
.hotel-box dt{
	font-size: 1.1em;
	line-height: 1.3;
	font-weight: bold;
	padding: 1em .5em .5em 5em;
}
.hotel-box .area{
	position: absolute;
	top:0;
	left:0;
	background: #f5be30;
	font-size: .9em;
	padding:0 4px;
	text-align: center;
	line-height: 1.4;
}
.hotel-box .image a{position: relative;}
.hotel-box .image a span{
	position: absolute; 
	bottom: 0; 
	right: 0;
	background: rgba(0,0,0,0.75);
	color: #fff;
	font-size: .75em;
	padding: 0 .3em;
}
.hotel-box .image a:hover{opacity: .7;}
.hotel-box .text{
	line-height: 1.3;
	text-align: justify;
	font-size: .95em;
	font-weight: 400;
	position: relative;
	flex-grow: 1;
	min-height: 100px;
	padding-bottom: 1em;
}
.hotel-box .text a{	
	display: block;
	padding: .5em .7em 1.5em;
}
.hotel-box .text a::after{
	content: "プランはこちら";
	position: absolute;
	bottom:.5em;
	right: 1em;
	color: #E09F13;
	border-bottom: 2px solid #E09F13;
	font-weight: 600;
}
.hotel-box .text a:hover,.hotel-box .text:hover{	background: #FBF7E3;}

/*------------------------------------------------------------------------------------------------------------ #entry */
#entry h3{text-align: center; margin-bottom: .5em;}
#entry h3 span{
	
	font-family: 'Noto Sans JP', sans-serif;
	color: #262626;
	border: #686868 1px solid;
	background: #CCCCCC;
	padding: 0px .2em;
	margin: 0 .2em;
}
#entry ul{
	display: flex;
	background: #f5be30;
}
#entry ul li{
	padding: .5em 2em .5em 1em;
	background:#f5be30;
	position:relative;
	flex: 1;
}
#entry ul li:before {/*スペースを作る*/
  content: '';
  top: 0;
  right: 0;
  width: 10%;/*指定したい幅*/
  display: block;
}
#entry ul li:after {/*画像を絶対配置*/
  position: absolute;
  content: '';
  top: 0;
  left:0;
  display: block;
  width: 100%;/*幅*/
  height: 100%;/*どれだけデカくなってもはみ出ないであろう高さを指定*/
  background-image: url(../img/arrow_r.png);
  background-size: contain;
  background-repeat: no-repeat;/*画像を繰り返さない*/
 	background-position: right;
  }

#entry ul li:nth-child(1){flex: 1.5;}
/*#entry ul li:nth-child(2){flex: 2;}*/
#entry ul li:last-child{flex: 1;	padding: .5em .5em .5em 1em;}
#entry ul li:last-child:before{width: 0;}
#entry ul li:last-child:after{background:none;}

#entry ul li .hojo{
	font-size: .9em;
	color: #003a75; 
	font-weight: 600; 
	line-height: 1.1; 
	margin: .5em 0;
}
#entry ul li .hojo span{
	background: #003a75;  
	color: #f5be30; 
	padding: 2px .5em;
	margin-bottom: .2em;
	display: inline-block;
}
#entry ul li a{
	text-decoration: underline!important;
}

#entry ul li h4{
	font-size: 1.1em;
	border-bottom: 2px solid #000000;
	margin-bottom: 1em;
}
#entry ul li h4:first-letter{font-size: 2em; font-weight: 900;}
/*------------------------------------------------------------------------------------------------------------ #dp */
#dp dl{	display: flex; margin: 3em auto;}
#dp dl dt{flex: 1; max-width: 452px;}
#dp dl dd{
	flex: 1;
	margin-left: 1em;
	font-weight: 600;
	font-size: 1.1em;	
}
#dp dl dd strong{font-size: 1.2em;}
#dp dl dd span{border-bottom: 1px solid #000000;}

/*------------------------------------------------------------------------------------------------------------ #booking */
#booking h3{
	font-family: 'Zen Maru Gothic', serif;
	font-size: 1.3em;
	color: #003a75;
    display: flex;
	align-items: center;
	margin: 2em 0 .5em .5em;
}

#booking h3:after {
	content: "";
    height: 10px;
    flex-grow: 1;
	transform: skew(-45deg);
    background-image: repeating-linear-gradient(90deg, transparent 0 4px, #B9C2D0 4px 6px);
	margin-left: 1.5rem;
}
#booking-flow dl{
	display: flex;
	margin: 2em 0 2em 3em;
	padding: .5em 3em;

	background: #edf1f6;
	box-shadow: 2px 2px 3px #909090;
	position: relative;
}
.nom{
	background: #003a75;
	padding: 0 .5em;
	line-height: 1.4;
	color: #fff;
	position: absolute;
	top:0;
	left: -3em;
}
.nom strong{font-size: 2em;}
#booking-flow dl dt{
	padding: 1em;
	line-height: 1.4;
	flex: 3;
}
#booking-flow dl dt strong{
	font-family: 'Zen Maru Gothic', serif;
	font-weight: 600;
	color: #003a75;
	font-size: 1.1em;
	display: block;
	margin-bottom: .5em;
}
#booking-flow dl a{font-weight: bold; text-decoration: underline!important;}
#booking-flow .image{
	flex: 2;
	align-self: center;
}
.info{font-size: .9em;}
.info strong{
	text-align: center;
	width: 7em;
	border: 1px solid #434343;
	display: block;
	margin-top: .5em;
}
.info span:not(.red){display: block; margin-top: .3em;}

#booking .info a{
	color: #1F6DE5;
	text-decoration: underline;
}

/*------------------------------------------------------slick*/
.slick-arrow_prev,
.slick-arrow_next {
	transform: scaleY(2);
	font-size: 1.5em;
	background: none;
	color: #01268B;
	font-weight: 800;
	line-height: 1;
	position: absolute;
	top:40%;
	z-index: 100;
}

.slick-arrow_prev {
	left: 0;
	padding: .2em .2em 0 0;	
}
.slick-arrow_next {
	right: 0;
	padding: .2em 0 0 .2em;	
}
.slick-arrow_prev:hover,
.slick-arrow_next:hover {	
	background: none;
	color: #0067F3;
}

.slick-list{padding: 0 8%;}

/* 中央以外のスライド */
.slick-img img {
  height: auto;
  opacity: .3;
  transform: scale(.8);
  transition: opacity .6s, transform .6s;
  width: 100%;
}
/* 中央のスライド */
.slider .slick-center img {
  opacity: 1;
  transform: scale(1);
}
.slick-slide {  opacity: .6;}
.slick-active {  opacity: 1;}


/*------------------------------------------------------------------------------------------------------------ #contact */
#contact{
	background: rgba(245,182,48,0.70);
	border: #003a75 3px solid;
	color: #003a75;
	padding: .5em;
	position: fixed;
	right: 0;
	bottom: 5em;
	font-size: .9em;
	background-image: linear-gradient(-135deg, #003a75 10px, transparent 0);
	font-weight: 600;
	text-align: center;
	z-index: 150;

}
#contact dt strong{font-size: 1.2em;	font-weight: 900; }
#contact a{
	font-size: 1.7em;
	font-weight: 900; 
	margin-right: .5em;
	text-decoration: underline!important;
	color: #003a75!important;
}

/************************************************************
					★min770px－max999px
************************************************************/
@media screen /*and (min-width: 770px) */and (max-width: 1000px){

#container, .w1000 {
	min-width: 100%;  
	width: 100%;
	margin: 0;
	overflow: hidden;
	padding-bottom: 12em;
}
.w1000{	padding: 0 5px;}
#title .w1000{	padding: 0;}	
/*---------------------------------------------コンテナ用★★★★★★★★-----*/
/*-------------------------------8月号*/
#fun img {
	width: 100%;
}
#fun .fun08{	
	background: 
		url(../img/fun08-1.png) no-repeat left 120% top / 120%,
		url(../img/fun08-2.png) no-repeat right 70% top / 130%,
		#d9e9f5;
	padding: .5em 0 2em;
}
.fun08 h3{	margin-top: -1.3em;}
#fun .fun08 h3 span img{width: 4em;}
.fun08 .number{	margin-left: calc(100% - 12em);}

}

/************************************************************
					★タブレット対応
************************************************************/
@media screen /*and (min-width:600px) */and (max-width:769px)  {
	
.pc{display: none;}
.sp{display: block;}
	/*--------------------パンくず */
#pankuzu{display: none;}
	
#container{	font-size: 14px;}
		

/*------------------------------------------------------------------------------------------------------------ main */	
/*------------------------------title*/
#title{
	max-height: 100%;	
}
#title h1{
    padding: 0;
    text-indent: 0;
    background: none;
}
h1 span{	margin-top: -1.5em;}	
#title{	background:none;}
	
/*------------------------------nav */
nav ul{	padding: 1em 0!important;}
/*------------------------------------------------------------------------------------------------------------ #fun */
.fun02{		background: url(../img/fun02.png) no-repeat left top / 100%,#d9e9f5;}
.fun02 h3{	font-size: 1.3em;}
.fun02 dl{	padding: 2em .5em .5em!important;}

/*-------------------------------8月号*/
#fun img {
	width: 100%;
}
#fun .fun08{	
	background: 
		url(../img/fun08-1.png) no-repeat left -50% top / 90%,
		url(../img/fun08-2.png) no-repeat right -50% top / 90%,
		#10A7FC;
}

	
/*-------------------------------8月号*/
.zurasshi-box dt{
	font-size:4vw;
	padding: .5em .5em .5em 4em;
}
.zurasshi-box .area{	font-size: 3.5vw;}
.zurasshi-box .ticket span{	font-size:2.7vw;}
.plan{	display: block;}	
	

/*------------------------------------------------------------------------------------------------------------ common */
section:not(#title){padding: 1em 0;}
/*------------------------------------------------------------------------------------------------------------ #booking */
#booking h3{	margin: 0 .5em;}
#booking-flow dl{
	display: block;
	margin: 3em 4em 2em 0em;
	padding: .5em 1em;
}
.nom{
	top:-2em;
	left: -.5em;
}

}
	

/************************************************************
						★スマホ対応
************************************************************/
@media screen and (max-width:599px)  {
	.sp_only{display: block;}
	.sp_none{display: none;}
	
#container{		padding-bottom: 0;}	
/*------------------------------------------------------------------------------------------------------------ main */	
#title + p{	font-size:4vw;	text-align: left;}
	#title + p br{display: none;}	
/*------------------------------nav */
nav ul{	padding: 0!important; display: block;}	
nav ul li {background: #FFFFFF; width:18em; margin: 5px auto;}
nav ul li a {	
	font-size: 1em;
	background: none;
	display: block;
	padding: 3px .5em;
	border-bottom: 3px #8EB7E8 solid;
}
/*------------------------------------------------------------------------------------------------------------ common */
h2{	font-size:3.8vw;}	

h2 strong{
	letter-spacing: -1px;
}
h2 strong::before{
  padding-right: 5px;
}
h2 strong::after{
  padding-left: 5px;
}	
/*------------------------------------------------------------------------------------------------------------ #fun */
#fun{	
	background: repeating-linear-gradient(90deg, #f6f6f6, #f6f6f6 10px, #fbfbfb 10px, #fbfbfb 20px);
}
.fun02{	
	background: url(../img/fun02.png) no-repeat left top / contain,#d9e9f5;
}
.fun02 .number{
	margin-left: calc(100% - 12em);
}
.fun02 h3{
	display: block;
	margin-top: -2.2em;
	font-size: 3.6vw;
	text-align: center;
}
.fun02 h3 span{display: block; width: 22%;}	
.fun02 dl{
	padding: .5em;
	max-width: 97%;
}
.fun02 dl .s_font{margin: 1em;}
	
/*-------------------------------8月号*/
.zurasshi-box dt{
	font-size:6vw;
	padding: .5em .5em .5em 3.5em;
}
.zurasshi-box .area{	font-size: 4.5vw;}
.zurasshi-box .ticket span{	font-size:2.7vw;}
#fun .zurasshi-box .ex span img{	max-width: 7em;}
.zurasshi-box .ex{	padding: 0 .2em 2em;	}
.zurasshi-box ul.flex_box{display: block;}
.zurasshi-box .ex span{
	display: block;
}
#container #fun .btn{font-size:3vw;}
#container #fun .btn a {font-size:4vw;}
	
/*-------------------------------hotel */
.hotel-box dt{	padding: 1.5em .5em .5em;}	
/*------------------------------------------------------------------------------------------------------------ #entry */
#entry ul{	display: block;}
#entry ul li{	padding: 0em 1em 2.3em;}
#entry ul li:after {/*画像を絶対配置*/
	background-image: url(../img/arrow_b.png);
	background-size: contain;
	background-repeat: no-repeat;/*画像を繰り返さない*/
	background-position: bottom;
}
#entry ul li:last-child{padding: 1em;}
/*------------------------------------------------------------------------------------------------------------ #dp */
#dp dl{	display: block; margin: 1.5em auto;}
#dp dl dt{margin-bottom: 1em;}
#dp dl dd{
	margin-left: 0;
	font-size: .95em;	
}
/*------------------------------------------------------------------------------------------------------------ #booking */
#booking h3{	font-size: 1.1em;	margin: 0 .5em;}
#booking-flow dl{
	display: block;
	margin: 3em 2em 2em 0em;
	padding: .5em 1em;
}
.nom strong{font-size: 1.2em;}

/*------------------------------------------------------------------------------------------------------------ #contact */
#contact{	position: static;}
.content_btn{
	background: rgba(245,182,48,0.70);
	border: #003a75 3px solid;
	color: #003a75;
	padding: .5em;
	position: fixed;
	right: 0;
	bottom: 10em;
	font-size: .9em;
	background-image: linear-gradient(-135deg, #003a75 10px, transparent 0);
	font-weight: 600;
	text-align: center;
	z-index: 150;
}
	
}

/***************************************************************************************
 about
***************************************************************************************/
#about,
#about dl{ margin: 3em auto; max-width: 1300px;}
.aboutcontent{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	max-width: 1500px;
	padding: 1em;
}
.aboutcontent dt{
	flex-basis: 49%;
	max-width:49%;
}
.aboutcontent dd{
	flex-basis: 45%;
	max-width: 45%;

}
.aboutcontent dt p{
	margin-bottom: 0.5em;
}
.about_illust{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	font-size:min(1.6vw,1.3em);
	font-weight: 500;
}
.about_illust li{
	padding: 1em;
	text-align: center;
	line-height: 1.2;
	position: relative;
}
.about_illust li img{
	display: block;
	margin: 0 auto;
	width: 100%;
}
.about_illust li:nth-of-type(1){	
	flex-basis: 10em;
	max-width: 10em;
}
.about_illust li:nth-of-type(1):after,
.about_illust li:nth-of-type(2):after{
	display: block;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%) scale(3,3);
	font-weight: bold;
	color: #CCC;
}
.about_illust li:nth-of-type(1):after{
	content: "+";
}
.about_illust li:nth-of-type(2):after{
	content: "=";
	right: -0.2em;
}
.about_illust li:nth-of-type(2){
	flex-basis: 7.5em;
	max-width: 7.5em;
	margin-right: 1.5em;
}
.about_illust li:nth-of-type(3){
	background-color: #003a75;
	color: #FFF;
	border-radius: 50%;
	flex-basis: 9.5em;
	max-width: 9.5em;
	height: 9.5em;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	padding:0;
}
.about_illust li:nth-of-type(3) strong{
	font-size: 1.3em;
	letter-spacing: -0.1em;
}
.about_illust li:nth-of-type(3) span{
	color: #FFD600;
	display: block;
	margin-bottom: 0.2em;
/*	font-size: 1.2em;*/
}
.about_illust li:nth-of-type(3) span:before,
.about_illust li:nth-of-type(3) span:after{
	content: "";
	display: inline-block;
	font-size: 0.7em;
}
.about_illust li:nth-of-type(3) span:before{content: "＼";}
.about_illust li:nth-of-type(3) span:after{content: "／";}


.merit{
	border: 1px solid #666;
	padding: 0.5em 1em 1.5em;
	background: rgba(255,255,255,0.8);
}
.merit:before{
	content: "POINT";
	display: inline-block;
	position: relative;
	left: -1.7em;
	background: #ffde76;
	color: #003a75;
	font-weight: bold;
	padding: 0 0.5em;
	box-shadow: 1px 1px 1px #CCC;
}
.merit li{
	margin-top: 0.5em;
	position: relative;
	padding-left: 1.5em;
	font-weight: bold;
}
.merit i{
	position: absolute;
	left: 0;
	top: 0.5em;
	color: #003a75;
}

/*-------1000px以下-----------------------------------------*/
@media only screen and (max-width: 1000px) {
#about p{
	text-align: left;
	padding: 0 1em;
}
	#about p br{display: none;}
}
/*-------768px以下-----------------------------------------*/
@media only screen and (max-width: 768px) {
.aboutcontent dt{
	flex-basis: 100%;
	max-width: 100%;
	margin-bottom: 1em;
}
.aboutcontent dd{
	flex-basis: 100%;
	max-width: 100%;
}
.about_illust{
	font-size: 3.2vw;
}
}
/*-------480px以下-----------------------------------------*/
@media only screen and (max-width: 480px) {
[id^="about"] h2{font-size: 4.5vw;}
}