@charset "UTF-8";

/*---------------------------------------------
01. common
---------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

table{border-collapse:collapse;border:none;}
th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

a { color:#333 ; text-decoration:underline; }
a:hover { color:#333 ; text-decoration:none; }
img{border:0;vertical-align:top}
li{list-style-type:none}
h1{clear:both;margin-top:0;}
h2{clear:both;margin-top:0;}
h3{clear:both;margin-top:0;}


/* = Selected Text　テキスト選択時
	----------------------------------------------- */
::selection {
	background:#ccc; /* Safari */
	color:#fff;
}
 
::-moz-selection {
	background:#ccc; /* Firefox */
	color:#fff;	
}



/*---------------------------------------------
02. layout
---------------------------------------------*/
body {
  width: 100%;
  margin: 0;
  font-family: 'Montserrat','Open Sans', Helvetica, Arial, Verdana, 'メイリオ', Meiryo, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN','ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  line-height: 1.5;
  font-size: 14px;
  background-color:#FFF;
  color: #404051;
  -webkit-text-size-adjust: 100%; }

#page-top,
.page-top {
    position: fixed;
    bottom: 0;
    width: 100%;
	z-index:9999;
	font-family: 'Montserrat';
	letter-spacing:.06em;
    font-size: 85%;
}
#page-top a,
.page-top a {
    background: #00B6CB;
    text-decoration: none;
    color: #fff;
    width: 100%;
    height: 55px;
    text-align: center;
        /*　box要素縦中央 */
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
}


#reserved {
    position: fixed;
    top: 50%;
    right: -100px;
	z-index:9999;
	font-family: 'Montserrat';
	letter-spacing:.06em;
    font-size: 90%;
}
#reserved a {
    background: #CCAF71;
    text-decoration: none;
    border-radius: 6px;
    color: #fff;
    width: 130px;
    height: 65px;
    text-align: center;
    transform: rotate(-90deg);
        /*　box要素縦中央 */
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
    align-items: center; /* 縦方向中央揃え */
    -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
    justify-content: center; /* 横方向中央揃え */
}


/*
@media only screen and (min-width: 0px) and (max-width: 768px) {
#page-top {bottom:35px;right: 30px;letter-spacing:.06em;font-size: 70%;}
#page-top a {width: 80px; padding:30px 0;}
}
*/


/*---------------------------------------------
header
---------------------------------------------*/

#header {
width: 100%;
}


#header ul{ margin:0; padding:0;}
#header li{ margin:0; padding:0;}


#header .inner {
width: 100%;
text-align:center;
margin: 40px auto 60px auto; }

#header .inner .logo { width:300px; margin:0 auto;}
#header .inner .logo img { width:100%;}

#header .inner .contact { width:120px; position:absolute; right:175px; top:40px; font-size:11px; font-weight:bold;}
#header .inner .contact a {  display:block; height:30px; border:#00B6CB 1px solid; color: #00B6CB;
border-radius:5px;
-webkit-border-radius: 5px;
-ms-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
text-decoration:none;}
#header .inner .contact p{position: relative; top:50%; transform: translateY(-50%);}

#header .inner .contact a:hover{
	background-color:#00B6CB;
	color:#FFF;
	border:#00B6CB 1px solid;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
	}


#header  .snsarea{ width:167px; position:absolute; right:40px; top:40px; }
#header  .facebook{width:32px; height:32px; margin:0 0 0 0; background-color:#00B6CB; display: block; float:left;
border-radius: 20%; -moz-border-radius: 20%; -webkit-border-radius: 20%; position: relative;}
#header  .twitter{width:32px; height:32px; margin:0 0 0 13px;background-color:#00B6CB;  display: block; float:left;
border-radius: 20%; -moz-border-radius: 20%; -webkit-border-radius: 20%; position: relative;}
#header  .instagram{width:32px; height:32px; margin:0 0 0 13px; background-color:#00B6CB; display: block; float:left;
border-radius: 20%; -moz-border-radius: 20%; -webkit-border-radius: 20%; position: relative;}
#header  .note{width:32px; height:32px; margin:0 0 0 13px; background-color:#00B6CB; display: block; float:left;
border-radius: 20%; -moz-border-radius: 20%; -webkit-border-radius: 20%; position: relative;}

#header .facebook img, #header .twitter img, #header .instagram img,header .note img{ position: relative; top:50%; transform: translateY(-50%);}
#header .facebook a ,#header .twitter a ,#header .instagram a,#header .note a{
display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}



#header .inner .gnavi{width:980px; margin: 45px auto 0 auto;}
#header .inner .gnavi a { text-decoration: none; display:block; width:163px;}

#header .inner .gnavi li{ float:left; margin:0px; width:163px; font-size:14px; font-weight:bold;}
#header .inner .gnavi li p{ font-size:10px; font-weight:normal; color:#00B6CB; margin:3px 0 0 0;}
#header .inner .gnavi .menu01{ margin:0 0 0 0 ; position: relative;}
#header .inner .gnavi .menu02{ margin:0 0 0 0 ; position: relative;}
#header .inner .gnavi .menu03{ margin:0 0 0 0 ; position: relative;}
#header .inner .gnavi .menu04{ margin:0 0 0 0 ; position: relative;}
#header .inner .gnavi .menu05{ margin:0 0 0 0 ; position: relative;}
#header .inner .gnavi .menu06{ margin:0 0 0 0 ; position: relative;}


/* Btn Hover */
#header .inner .gnavi li:after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 4px;
	bottom: -3px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3 ease;
	-o-transition: all 0.3 ease;
}
#header .inner .gnavi li:hover:after {
	background: #00B6CB;
	bottom: -20px;
}


/*
@media only screen and (min-width: 0px) and (max-width: 768px) {
#header .catch { width:60%; margin:0 auto; position:absolute; left:20%; top:-2vw; z-index:9999;}
#header .catch img{ width:100%;}
#header .catchcap{ width:60%;font-size:9px; line-height:150%; text-align:center; position:absolute;left:20%; top:13vw;}
#header .inner {width:100%; margin: 20px auto 0 auto; }
#header .inner .logo { width:180px; margin:0 auto;}
#header .inner .logo img { width:180px; margin-top:40px;}
#header .inner .logo2 { width:95px; position:absolute; left:-30px;}
#header .inner .logo2 img{ width:95px; position:absolute;}

#header .inner .contact { width:60px; position:absolute; right:40px; margin-top:-68px; }
#header .inner .contact a { display:block; border-left: none;  margin:0 0 0 0;}
#header .inner .contact img {margin:10px 0 0 0; width:60px;}

#header .indexinner {width: 80%; font-size:11px; margin: 0 auto 40px auto;}
#header .indexinner p{margin: 20px 0 0 0; }

#index_contents{width:100%; background-color:#F5F5F5;padding:40px 0 0 0;}
.index_contentsdetail{width:78%;margin: 0 auto;}
}
*/

#navigation{display: none;}
.menuarea{display: none;}



/*---------------------------------------------
index
---------------------------------------------*/

#index_contents{
	width:100%;
	background-color: #F7F7F7;
	margin-top:-40px;
	padding-top:30px;
	}

.indexdetail{
	width:1020px;
    margin:0 auto 0 auto;
}

.postarticle{ width:300px; float:left; margin:30px 20px 0 20px;}
.postarticle .option{background-color:#FFF;}
.postarticle .articlebody{ width:260px; padding:15px 20px 15px 20px; background-color:#FFF; border-top:#00B6CB 4px solid; margin-top:0;}
.postarticle .articlebody .tourttl{ font-size:15px; margin:0 0 15px 0; line-height:200%;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
/*background:url(../images/icon_article.png) no-repeat; padding:0 0 0 35px;
background-size:24px 24px; background-position:0 8px;*/}
.postarticle .articlebody .tourttl a {
	text-decoration:none;
}
.postarticle .articlebody .tourttl a:hover {
	color:#00B6CB;
	text-decoration:none;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}

.postarticle .articlebody .tourttl p{ font-size:12px; margin-bottom: -15px;}

.postarticle .articlebody .bodytext{ font-size:13px; line-height:200%;}

.postarticle .option dl{ font-size:12px; line-height:100%; letter-spacing:.03em;}
.postarticle .option dt{width:50px; text-align:center; padding:6px; float:left; font-size:11px; color:#FFF; background-color:#00B6CB; margin:0 0 10px 0;}
.postarticle .option dd{width:186px; padding:6px 0 6px 12px; float:left; margin:0 0 10px 0; line-height: 160%;}

.postarticle .cate_name{position: absolute; top: 160px; right: 0; z-index: 100;}

.postarticle .states{position: absolute; top: 155px; left: 0; z-index: 100;}
.postarticle .states img{width: 100px;}

.postarticle .states2{position: absolute; top: 25px; left: 0; z-index: 100;}
.postarticle .states2 img{width: 100px;}


#newsarea{ width:980px; margin:30px auto 30px auto;}
.listnews{ width:865px; margin:0 0 1px 0; letter-spacing:.05em; background-image:url(../images/ico_new02.png); background-repeat:no-repeat; background-size:60px 28px;
 background-color:#FFF; background-position:15px 14px; padding:18px 25px 38px 90px; position:relative; font-size:12px;}
.listnews br{ display:none;}
.listnews a{position:absolute; top:0; left:0; width:872px; height:auto;padding:18px 25px 21px 90px; text-decoration: underline; color:#333; 
background-image:url(../images/ico_new02.png); background-repeat:no-repeat; background-size:60px 28px;background-position:15px 14px;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.listnews a:hover{background-color:#EEE; width:865px;height:auto;text-decoration:none;
background-image:url(../images/ico_new02.png); background-repeat:no-repeat; background-size:60px 28px;background-position:15px 14px;
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.listnewsdate{ font-weight:bold;}


.sortarea{width: 980px; margin: 40px auto 10px auto; position: relative;}

.tagarea{width: 617px; float: left; margin-top: 10px;}
.tagarea li{float: left; margin-right: 1px;}
.tagarea li a{font-size: 12px; display: block;  text-decoration: none; padding: 8px 15px 6px 15px;}

.btn_sort{width: 100%; float: none;}
.btn_sort li{float: left; text-align: center; font-size: 13px; margin-right: 1px;}
.btn_sort li a{display: block; width: 139px; height: 40px; color: #666; background-color:#FFF; text-decoration: none; 
	transition: all 0.1s ease;
  /*　box要素縦中央 */
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  /* 縦方向中央揃え（Safari用） */
  align-items: center;
  /* 縦方向中央揃え */
  -webkit-justify-content: center;
  /* 横方向中央揃え（Safari用） */
  justify-content: center;
  /* 横方向中央揃え */
	background-image: url(../images/arrow_02.png);
	background-repeat: no-repeat;
	background-size: 18px 18px;
	background-position: 13px 11px;
}
.btn_sort li a:hover{background-color:#00B6CB; color: #FFF; transition: all 0.2s ease;
	background-image: url(../images/arrow_01.png);
	background-repeat: no-repeat;
	background-size: 18px 18px;
	background-position: 13px 11px;
}


.select_sort{width: 1010px; height: 50px; margin: 20px auto 20px auto; position: relative;}

   .select_sort select{
       position: absolute;
       top: 0; right: 0;
	   width:300px;
	   height: 50px;
	   margin: 0 15px 0 15px;
	   float: left;
	   font-size: 13px;
	   border: 1px solid #FFF;
        outline:none;
        text-indent: .5em;
        vertical-align: middle;
        color: inherit;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
	   	background: url(../images/select_arrow.gif) right 50% no-repeat #FFF;
	   background-size:48px 48px;
    }
   .select_sort select option{

    }
   .select_sort select::-ms-expand {
      display: none;
    }
  .select_sort  select:-moz-focusring { 
      color: transparent; 
      text-shadow: 0 0 0 #828c9a;
    }



/*---------------------------------------------------
	Roop image
---------------------------------------------------*/
#mainvisual01 {
	width:100%;
	height:200px;
	margin:-30px 0 60px 0 ;
	background-image:url(../images/mainvisual.jpg);
	background-size: 2667px 200px;
	background-position:center;
	background-repeat:repeat-x;
}



/*---------------------------------------------
detail
---------------------------------------------*/

#contents{
	width:100%;
	padding:0 0 60px 0;
}

.contentsdetail{
	width:980px;
    margin: 0 auto;
}

.tagdetail{
	width:1020px;
    margin:30px auto 0 auto;
}


.contentsdetail .left{width:470px; margin:20px 40px 0 0; float:left;}
.contentsdetail .right{width:470px; margin:20px 0 0 0; float:left;}


.body_title{ width:930px; font-size:22px; letter-spacing:.03em;
padding:30px 0 30px 50px; margin:0 0 30px 0;
background:url(../images/icon_article.png) no-repeat;
background-size:36px 36px; background-position:0 28px;
border-top:#00B6CB 4px solid;
border-bottom:#DDD 1px solid; }

.articlebody{ width:470px; font-size:13px; line-height:220%; margin:-10px 0 30px 0;}
.detailbody{ font-size:13px; line-height:220%;}
.detailbody li{ display: flex; flex-wrap: wrap; border-top: #DDD 1px solid; padding: 15px 0; }
.detailbody li div.flexL {
    position: relative;
    width: 7em;
    font-weight: bold;
}
.detailbody li div.flexL::after {
    content: "：";
    position: absolute;
    right: 1em;
    top: 0;
}
.detailbody li div.flexR {
    width: calc(100% - 7em);
}
div.articleBtn {
    margin: 25px 0 0;
}
div.articleBtn a {
    position: relative;
    display: block;
    width: 240px;
    height: 36px;
    background: #00B6CB!important;
    border-radius: 6px;
    color: #FFF;
    line-height: 36px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    transition: all 0.3s ease;
}
div.articleBtn a:hover {
    background: #CCAF71!important;
}
/* アイコンのスタイル */
div.articleBtn a::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 24px;
    width: 9px;
    height: 9px;
    margin: auto;
    border-top: 2px solid #FFF;
    border-right: 2px solid #FFF;
    transform: rotate(45deg);
    box-sizing: border-box;
    transition: all 0.3s ease;
}
div.articleBtn a:hover::after {
    right: 21px;
}

.detailbody3{ width:430px; font-size:12px;line-height:200%; margin-top:10px; background-color:#F7F7F7; padding:20px;}

.bikounone{ display:none!important;}
.accessnone{ display:none!important;}

.detailbody3 span{ font-weight:bold;}

.detailbody5{ width:470px; font-size:11px;line-height:200%; margin-top:20px;}
.detailbody5 strong{ font-weight:bold;}



.detailbody2{ width: 470px; font-size: 13px; border-top: #DDD 1px solid; border-bottom: #DDD 1px solid; line-height: 200%; padding: 25px 0; margin: 0 0 30px;}
.rout{ width:80px; font-size:10px; color:#00B6CB; text-align:center; border:#00B6CB 1px solid; font-weight:bold;
line-height:100%; padding:6px 0; margin:0 0 10px 0 ;}

.detailbody4{ width: calc(100% - 60px); max-width: 920px; font-size: 11px; line-height: 220%; background-color: #F7F7F7; padding: 30px; margin: 60px 0 0;
border-top:#00B6CB 2px solid;}
.detailbody4 .left{ width:50%; margin:0 0 15px;}
.detailbody4 .left img{ width:100%; height: auto;}
.detailbody4 .right{ width:100%; font-size:13px;}
.detailbody4 .right .name{ font-weight:bold; font-size:16px; margin:0 0 8px;}
.detailbody4 .right .caption{ font-weight:bold; font-size:13px; margin: 0;}


.detailbody6{ width:920px; font-size:11px;line-height:220%; background-color: #FFF; padding:30px; margin:50px auto 0 auto;
border-top:#00B6CB 2px solid;}
.detailbody6 .left{ width:230px; float:left; margin:0;}
.detailbody6 .left img{ width:200px; float:left; margin:0;}

.detailbody6 .right{ width:690px; float:left; margin:0; font-size:13px; position:relative;}
.detailbody6 .right .name{ font-weight:bold; font-size:16px; margin:0 0 8px 0;}
.detailbody6 .right .caption{ font-weight:bold; font-size:13px; margin: 0;}


.guideinfo{ width: 130px; font-size: 13px; color: #fff; text-align: center; background-color: #00B6CB; line-height: 100%; padding:10px 0; position:absolute; left: 0; top: -33px;}


#itemslide{width:470px; margin:0 0 0 0;}
.slideritem{ width:470px;}
.slideitemblock{ width:470px; height:340px; margin: 0 0 0 0;}
.slideitemblock .mainimage{ width:470px; height:340px;}
.slideitemblock .mainimage img{ width:470px; height:340px;}


#gm{}
.mapstyle_detail{width:470px; height:320px; margin:50px auto 30px auto;}
.mapstyle_detail iframe{width:470px; height:320px;}

.btn_caption{
	width:940px;
	font-size:11px;
	line-height:200%;
	padding:20px;
	border:#DDD 1px solid;
	margin:30px auto 50px auto;
	}

.btn_caption a{ color:#00B6CB;}


.btn_estimate{
	width:420px;
	margin:0 auto;
}
.btn_estimate a{
	display:block;
	text-align:center;
	color:#FFF;
	font-size:17px;
	font-weight:bold;
	letter-spacing:.05em;
	text-decoration:none;
	padding:20px 0;
	background-color:#CCAF71;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	}

/*  記事詳細　タグ */ 

.article_tagbody{width: 100%; margin: 30px 0 30px 0;}
.article_tagbody ul{margin: 0 0 0 -10px; padding: 0;}

.article_tagbody li{list-style: none; float: left; margin: 0 10px 20px 10px; }
.article_tagbody li a{font-size: 11px; text-decoration: none; padding: 2px 10px 1px 10px; line-height:220%;}

/**** Tag btn action ****/

.tag-btn {
  background: #999999;
  color: #FFF!important;
  outline: none !important;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
}

.tag-action {
  z-index: 1;
}
.tag-action:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background: #00b9ce;
  transition: all 0.3s ease;
}
.tag-action:hover {
  color: #FFF!important;
}
.tag-action:hover:after {

	left: 0%;
	right: auto;
	width: 100%;
}
.tag-action:active {top: 0;}


/*---------------------------------------------
03. news detail
---------------------------------------------*/
.news_title{ width:930px; font-size:22px; letter-spacing:.03em;
padding:30px 0 30px 50px; margin:0 0 30px 0;
background:url(../images/icon_article.png) no-repeat;
background-size:36px 36px; background-position:0 28px;
border-top:#00B6CB 4px solid;
border-bottom:#DDD 1px solid;}

.newsbody{ font-size:13px; line-height:220%; width:980px; position:relative; margin-top:15px;}
.newsdate{ font-size:13px; line-height:100%; letter-spacing:.03em; width:980px; text-align:right; position:absolute; top:10px;}

/*---------------------------------------------
03. 固定ページ
---------------------------------------------*/
#detail_page{
	width:100%;
	background-color: #F7F7F7;
	/*margin-top:-40px;*/
	padding: 50px 0;
}
.pagetitle{ width:980px; margin:30px auto 0 auto; font-size:20px; font-weight:bold; text-align:center;}
.pagetitle .eng{ width:980px; margin:0 auto; color:#00B6CB; font-size:12px;}
.pagetitle .border{ width:40px; margin:8px auto 10px auto; border-top: 3px solid #00B6CB;}


.detail_page2{
	width:1020px;
    margin:20px auto 0 auto;
}


.privacy{ width:700px; margin:0 auto; letter-spacing:.03em;} 
.privacy .title01{ font-size:18px; font-weight:bold; margin:40px 0 20px 0; } 
.privacy .copy01{ font-size:13px; line-height:220%; margin:20px 0 0 0;}
.privacy .copy01 strong{ font-weight:bold;}
.privacy .title02{ font-size:13px; color:#00B6CB; background-color:#FFF; border:#00B6CB 1px solid; font-size:18px; 
font-weight:bold; text-align:center; padding:8px 0 8px 0; margin:40px 0 20px 0;}

.qanda{ width:680px; margin:25px auto 0 auto; letter-spacing: .05em; line-height: 200%; font-size: 13px;} 

.qa_ttl{width: 100%; border-top: 3px solid #00B6CB; padding:20px 0 20px 0; background-color: #FFF;
    font-size:18px; font-weight: bold; color:#565656; margin: 30px 0 30px 0; text-indent: 25px;
}

.qa01{
	padding: 22px 0 10px 50px;
	background-image: url(../images/icon_q.png);
	background-size: 32px 32px;
	background-repeat: no-repeat;
	background-position: 0 18px;
	font-weight: bold;
	color: #565656;
}
.qa02{
	padding: 22px 0 10px 50px;
	background-image: url(../images/icon_a.png);
	background-size: 32px 32px;
	background-repeat: no-repeat;
	background-position: 0 18px;
}

.btnarea01{
	width: 100%; 
	text-align: center; 
	font-size: 12px;
	margin: 60px 0 0 0; 
	border-top: #DDD 1px solid; 
	padding: 60px 0 0 0;
}

.btnarea01 img{ margin-top: 30px;}

/* Insta show*/
.instaarea{width: 980px; margin: 40px auto 0 auto;}
.btn_insta{width: 370px; margin: 40px auto 0 auto;}


/*---------------------------------------------
04. Aboutページ
---------------------------------------------*/
.about{width:980px; margin:0 auto;}

.about_ttl01{width:980px; position: relative; margin: 50px 0 0 0;}
.about_ttl01 .parts01{width: 100%; position: absolute; top: 130px;}
.about_ttl01 .parts01 img{width:340px;}

.about_ttl01 .parts02{width: 100%; text-align: right;}
.about_ttl01 .parts02 img{width:720px;}

.about_ttl02{width:980px; margin: 50px 0 80px 0;}
.about_ttl02 .left{float: left; width:500px; margin:80px 0 0 0; position: relative;}
.about_ttl02 .left img{width:320px;}
.about_ttl02 .left .img01{margin-left: 90px; z-index: 100; position: relative;}
.about_ttl02 .left .img02{position: absolute; left:20px; top:210px;}
.about_ttl02 .right{float: left; width:480px; font-size: 14px; line-height: 240%; letter-spacing: .03em;}

.about_ttl02 .right .sp_view{display: none;}


.about_block01{width:900px; background-color: #FFF; padding: 40px 40px 40px 40px; margin-top: 65px;}
.about_block01 .ttl01{margin-bottom: 10px;}
.about_block01 .ttl01 img{width:325px;}
.about_block01 .parts01 {float: left; margin: 30px 25px 0 25px;}
.about_block01 .parts01 img{width:250px;}


.about_block01 .ttl02{margin-bottom: 10px;}
.about_block01 .ttl02 img{width:297px;}
.about_block01 .ttl02 .left{float: left; width: 440px;}
.about_block01 .ttl02 .right{float: left; width:460px; font-size: 13px; line-height: 180%;}

.about_block01 .parts {width:840px; margin: 0 auto; }

.about_block01 .parts02 {float: left; margin: 30px 40px 20px 40px;}
.about_block01 .parts02 img{width:200px;}
.about_block01 .parts02 .name{
	width: 80%; 
	position: relative;
	margin: -30px auto  0 auto; 
	padding-top: 16px;
	background-color: #FFF;
	font-size: 15px;
	text-align: center;
}

.about_block01 .parts02 .name p{font-size: 11px; margin:6px 0 0 0; }

.about_block01 .centercap{font-size: 15px; margin:30px 0 30px 0; text-align: center; letter-spacing: .04em; }
.about_block01 .centercap span{ border-bottom:solid 2px #333; border-style: dotted; padding-bottom: 8px;}


.about_block01 .ttl03{}
.about_block01 .ttl03 img{width:365px;}

.about_block01 .parts03 {width:900px; margin:40px 0 60px 0;}

.about_block01 .parts03 .left{width:100px; float: left;}
.about_block01 .parts03 .left img{width:80px;}

.about_block01 .parts03 .right{width:800px; float: left;}
.about_block01 .parts03 .right .r_block01{width: 340px; float: left; position: relative;}
.about_block01 .parts03 .right .r_block01 .ttl{background-color: #FFF; padding: 15px 15px 5px 15px; position: absolute;}
.about_block01 .parts03 .right .r_block01 .ttl .ttl01{width: 164px;}
.about_block01 .parts03 .right .r_block01 .ttl .ttl02{width: 95px;}


.about_block01 .parts03 .right .r_block01 .image {margin: 20px 0 0 20px;}
.about_block01 .parts03 .right .r_block01 .image img{width: 280px;}

.about_block01 .parts03 .right .r_block02{width:460px; float:left;}
.about_block01 .parts03 .right .r_block02 .ttl{font-size:18px; letter-spacing: .04em; margin:18px 0 20px;}
.about_block01 .parts03 .right .r_block02 .body{font-size:13px; line-height: 200%; letter-spacing: .04em;}
.about_block01 .parts03 .right .r_block02 .cap{font-size:12px; margin-top: 10px;}

.about_block01 .parts_arrow{width: 100%; text-align: center; margin: 20px 0 0;}
.about_block01 .parts_arrow img{width: 52px; }


.about_block01 .parts04 {width:780px; margin:30px 0 0 120px;}
.about_block01 .parts04 .ttl{font-size:18px; letter-spacing: .04em; margin:18px 0 20px;}
.about_block01 .parts04 .body{font-size:13px; line-height: 200%; letter-spacing: .04em;}

.about_block01 .parts03 .fl_area{width: 800px; margin-left: 100px;}
.about_block01 .parts03 .fl_img01{width: 200px; float: left;}
.about_block01 .parts03 .fl_img01 img{width: 185px;}


/*.about{ width:980px; margin:0 auto; font-family:"ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif; text-align:center;} 
.about .title01{ font-size:26px; letter-spacing:.05em; line-height:180%; margin:40px 0 0 0;} 
.about .copy01{ font-size:13px; letter-spacing:.03em; line-height:220%;} */

/*---------------------------------------------
05. footer
---------------------------------------------*/

#footer {
width: 100%;
text-align:center;
background-color: #F7F7F7;
}
#footer .inner {
margin: 0 auto;
padding: 60px 0 120px 0; }

#footer .logo img { width:180px; margin:30px 0 20px 0;}
#footer .copy { font-size:13px; letter-spacing:.03em;
font-family: 'Montserrat', Helvetica, Arial, Verdana, sans-serif;}

#footer .submenu{ font-size:12px; margin:30px 0 0 0;}


#footer  .snsarea{ width:275px;margin:0 auto; padding:0 0 0 0; }
#footer  .facebook{width:50px; height:50px; margin:0 0 0 0; background-color:#00B6CB; display: block; float:left;
border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; position: relative;}
#footer  .twitter{width:50px; height:50px; margin:0 0 0 25px;background-color:#00B6CB;  display: block; float:left;
border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; position: relative;}
#footer  .instagram{width:50px; height:50px; margin:0 0 0 25px; background-color:#00B6CB; display: block; float:left;
border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; position: relative;}

#footer  .note{width:50px; height:50px; margin:0 0 0 25px; background-color:#00B6CB; display: block; float:left;
border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; position: relative;}

#footer  .facebook img{ margin-top:16px;}
#footer  .twitter img{ margin-top:18px;}
#footer  .instagram img{ margin-top:16px;}
#footer  .note img{ margin-top:15px;}


#footer  .facebook a ,footer  .twitter a ,footer  .instagram a,footer  .note a{
display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


/*---------------------------------------------
04. form
---------------------------------------------*/
.formarea{ width:680px; margin:55px auto 0 auto; text-align:left;} 


.formname {
	width:165px;
	float: left;
	margin:0 0 0 0;
	line-height:140%;
	color:#0d3143;
	padding:10px 0 0 0;
}

.formname .jp{font-size: 14px; font-weight: bold; letter-spacing: .1em;}
.formname .en{font-size: 11px; margin-top:2px; color: #00B6CB;}


  .formborder input {
	width: 473px;
	float: left;
	padding: 20px;
	color:#0d3143;
	border: 1px solid #FFF;
	font-size: 100%;
	margin-bottom: 50px;
}

  .formborder2 input {
	width: 473px;
	float: left;
	padding: 20px;
	color:#0d3143;
	border: 1px solid #FFF;
	font-size: 100%;
	margin-bottom: 20px;
}


  .formborder textarea {
	width: 473px;
	padding: 20px;
	color:#0d3143;
	border: 1px solid #FFF;
	font-size: 100%;
}
.btn_submit {
	width:350px;
	height:90px;
	margin: 80px auto 30px auto ;
}

.btn_submit input {
	width:350px;
	height:90px;
	text-align: -9999px;
	background-image:url(../images/submit.gif);
	background-size:350px 90px;
	border: none;
    background-position: 0 0;
    background-color: transparent;
	cursor: pointer; 
}


   .formselect select{
	   width: 515px;
	   height: 60px;
	   float: left;
	   font-size: 13px;
	   border: 1px solid #FFF;
	   margin-bottom: 50px;
        outline:none;
        text-indent: .5em;
        vertical-align: middle;
        font-size: inherit;
        color: inherit;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
	   	background: url(../images/select_arrow.gif) right 50% no-repeat #FFF;
	   background-size:58px 58px;
    }
   .formselect select option{

    }
   .formselect select::-ms-expand {
      display: none;
    }
  .formselect  select:-moz-focusring { 
      color: transparent; 
      text-shadow: 0 0 0 #828c9a;
    }


.btnarea02{
	width: 100%; 
	text-align: center; 
	font-size: 13px;
	line-height: 180%;
	margin: 50px 0 50px 0; 
	border-top: #DDD 1px solid; 
	padding: 30px 0 0 0;
}
.btnarea02 a{color:#00b9ce; }

.formcaption01{width: 515px; margin:0 0 50px 165px; font-size: 12px; }
.formcaption02{font-size: 13px; margin-top: 50px; line-height: 200%;}
.thankstitle{font-size: 15px; font-weight: bold; letter-spacing: .1em; text-align: center; margin-bottom: 30px;}
.thanksbody{text-align: center;  margin-bottom: 30px;}
.thanksback{text-align: center;}


/*---------------------------------------------------
	Table color
---------------------------------------------------*/
.colTable {
font-size:12px;
line-height:180%;
border-top: 1px solid #59878F; border-left: 1px solid #59878F; border-right: 1px solid #59878F; }

.colTable th {
padding: 20px 20px;
border-bottom: 1px solid #59878F; border-right: 1px solid #59878F;border-bottom: 1px solid #59878F;
vertical-align: top; }

.colTable td {
padding: 20px 20px;
border-bottom: 1px solid #59878F; }

.colTableback {
font-size:12px;
color: #fff;
font-weight:100;
background-color: #476A71;}


.colTable2 {
font-size:12px;
margin:30px 0 0 0 ;
line-height:180%;background-color:#FFF;
border-top: 1px solid #59878F; border-left: 1px solid #59878F; border-right: 1px solid #59878F; }

.colTable2 td {
padding: 10px 15px;
border-bottom: 1px solid #59878F; }

.colTableback2 {
color: #fff;
font-weight:100;
background-color: #177795;}


.colTable3 {
font-size:12px;
margin:30px 0 0 0 ;
line-height:180%;background-color:#FFF;
border-top: 1px solid #59878F; border-left: 1px solid #59878F; border-right: 1px solid #59878F; }

.colTable3 td {
padding: 10px 15px;
border-right: 1px solid #59878F;
border-bottom: 1px solid #59878F; }

.tdgray{ background-color:#EEE;}



/*---------------------------------------------------
	ボタンセッティング
---------------------------------------------------*/

/*over zoom*/
.view1 {width:300px;height: 210px;overflow: hidden;position: relative;text-align: center;cursor: pointer;}
.view1 .mask,.view1 .content {width: 300px;height: 210px;position: absolute;overflow: hidden;top: 0;left: 0;}
.view1 img {display: block;position: relative; width: 300px;height: 210px;}
.view-first .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background: rgba(255,255,255, 0.8) /*url(../images/btn_mask.png) no-repeat center 95px*/;
   /*background-size:150px;*/
   -webkit-transition: all 0.1s ease-in-out;
   -moz-transition: all 0.1s ease-in-out;
   -o-transition: all 0.1s ease-in-out;
   -ms-transition: all 0.1s ease-in-out;
   transition: all 0.1s ease-in-out;
}
.view-first:hover .mask {-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";filter: alpha(opacity=100);opacity: 1;}
.view-first img {
   -webkit-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
   -moz-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
   -o-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
   -ms-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
   transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}



/*---------------------------------------------------
	ページネーション
---------------------------------------------------*/


.pagination {
	clear: both;
	padding: 20px 0;
	position: relative;
	font-size: 15px;
	line-height: 14px;
        text-align: center;
}
.pagination-box {
	display: inline-block;
}
.pagination span, .pagination a {
	display: block;
	float: left;
	margin: 1px 1px 1px 0;
	padding: 15px 20px 15px 20px;
	text-decoration: none;
	width: auto;
	color: #fff; /* 通常の文字色 */
	background: #00B6CB; /* 通常の背景色 */
}
.pagination a:hover{
	color: #FFF; /* マウスホバー時の文字色 */
	background: #177795; /* マウスホバー時の背景色 */
}
.pagination .current{
	padding: 15px 20px 15px 20px;
	color: #FFF; /* 現在のページの文字色 */
        background: #CCC; /* 現在のページの背景色 */
}
@media only screen and (max-width: 768px) {
.pagination {
	font-size: 14px;
	line-height: 12px;
}
.pagination span, .pagination a {
	padding: 10px 15px 10px 15px;
}
.pagination .current{
	padding: 10px 15px 10px 15px;
}
}


/*---------------------------------------------------
	検索
---------------------------------------------------*/

#searcharea{position: absolute; top: 90px; right: 50px;}

#searchform{
 position:relative;
}
#s-box{
	width: 169px;
	font-size: 12px;
 height: 28px;
 padding: 0 10px;
 border:solid 1px #DDD;
 outline: 0;
	color: #4F4F4F;
}
#s-btn-area{
 width: 50px;
 height: 30px;
 outline: 0;
	position: relative;
	left: 12px;
	background: none;
 border: none;
cursor:pointer;
}
#s-btn{
	position: absolute;
	left: -9px;
	top:0;
 background-color: #00B6CB;
 width: 50px;
 height: 30px;
 position: relative;
 border-radius: 5px;
 font-size: 13px;
	letter-spacing: .06em;
 color: #fff;
 line-height: 31px;
}

#searchform button{transition: all 0.3s ease-in-out;}
#searchform button:hover{opacity: 0.7!important; transition: all 0.1s ease-in-out;}



/*---------------------------------------------------
	# TOPページ　Slide area
---------------------------------------------------*/

.slidearea {
  width: 980px;
    height: 400px;
    margin: 10px auto 0 auto;
  position: relative;
}
.slidearea .slidenumber {
  position: absolute;
  top: 30px;
  right: 35px;
  width: 60px;
  height:22px;
  background-color: #00B9CE;
  font-size: 12px;
  color: #FFF;
  letter-spacing: .07em;
  text-align: center;
  /*　box要素縦中央 */
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  /* 縦方向中央揃え（Safari用） */
  align-items: center;
  /* 縦方向中央揃え */
  -webkit-justify-content: center;
  /* 横方向中央揃え（Safari用） */
  justify-content: center;
  /* 横方向中央揃え */
  z-index: 2;
}

.slidearea .slidenumber img {
  width: 9px;
  margin: -1px 7px 0 7px;
}

.slider {
  position: relative;
  z-index: 1;
}
.slider:before{
  content: "";
  display: block;
  padding-top: 43%;
}
.slider .slide {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 400px;
  overflow: hidden;
    background-color: #FFF;
}
.slide_img{
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.slide_img img {
  width: 100%;
    height: 100%;
  transform: scale(1);
}
.slide-scale .slide_img img {
  transform: scale(1);
  transition: transform 3s ease;
}

.progress{
  position: absolute;
  right: 0;
  top: 0;
  height: 0;
  width: 4px;
  z-index: 10;
  background-color: #00d6f9;
}
.slide-progress .progress{
  transition: height 4.6s linear;
  height: 100%;
}


/* -------------  google カレンダー ------------*/
.cal_wrapper {
  max-width: 800px; /* 最大幅 */
  min-width: 300px; /* 最小幅 */
  margin: 2.0833% auto;
}
 
.googlecal {
  position: relative;
  padding-bottom: 75%; /* 縦横比 */
  height: 0;
  overflow: hidden;
}
.googlecal iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* -------------  アコーディオン ------------*/


.accordion-container {
  max-width: 800px; /* 最大幅 */
  margin: 40px auto 0 auto;
}

.accordion-content {padding-top:20px;}



.accordion-container .accordion-title {
  position: relative;
  margin: 0;
  padding: 1.225em 0.625em 1.225em 1.5em;
  background-color: #00B6CB;
  font-size: 1.15em;
  font-weight: bold;
  color: #fff;
  cursor: pointer;
    letter-spacing: .04em;
}

.accordion-title span {font-size: 10px; font-weight: normal; margin-left: 1.5em;}

.accordion-container .accordion-title:hover,
.accordion-container .accordion-title:active,
.accordion-title.open { 
  background-color: #00a3c9;
}

.accordion-container .accordion-title::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  width: 18px;
  height: 2px;
  /*縦線に*/
  transform: rotate(90deg);
  background: #fff;
  transition: all .3s ease-in-out;
}

.accordion-container .accordion-title::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 25px;
  /*横線*/
  width: 18px;
  height: 2px;
  background: #fff;
  transition: all .2s ease-in-out;
}

.accordion-container .accordion-title.open::before {
  transform: rotate(180deg);
}

.accordion-container .accordion-title.open::after {
  opacity: 0;
}

.accordion-container.hidden{
  display: none;
}




/* -------------  矢印 ------------*/

.arrowarea_r{width:50px; position: absolute; right:0; top: 44%; z-index:2;}
.arrowarea_l{width:50px; position: absolute; left:0; top:44%; z-index:2;}


.btn_arrow {
  background: #FFF;
  text-align: center;
  width: 50px;
  height: 50px;
  outline: none !important;
  cursor: pointer;
  transition: all 0.35s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
  position: relative;
  display: inline-block;
	z-index:1;
}

.btn_arrow:after {
  position: absolute;
  content: "";
  width: 100%;
  height: 0;
  bottom: 0;
  right: 0;
  z-index: -1;
  background: #eaeaea;
  transition: all 0.35s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}
.btn_arrow:hover {
}


.btn_arrow:hover:after {
	left: 0%;
	right: auto;
	height: 100%;
}

.btn_arrow:active {top: 0;}


/*  SVG 色サイズ設定*/
.my_svg01{
	width: 8px;
	height: auto;
	margin-top:19px;
}
.my_svg01 path{
    color:#0d3143;
    fill: currentColor;
	transition: all 0.1s ease;
}
.my_svg01 .st0{fill:#000;}

/*　hover時のSVGカラー
.btn_arrow:hover .my_svg01 .st0{
	fill:#0d3143;
	transition: all 0.1s ease;
}*/

/*　hover時のSVG位置*/
.arrowleft .my_svg01{
	position: relative;
	left:0;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}

.arrowleft:hover .my_svg01{
	position: relative;
	left:-8px;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}
.arrowright .my_svg01{
	position: relative;
	left:0;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}

.arrowright:hover .my_svg01{
	position: relative;
	left:8px;
	transition: all 0.3s cubic-bezier(0.215, 0.61, 0.325, 1) 0s;
}

.grecaptcha-badge {
	z-index: 9999!important;
}

/*----- TOUR -----*/
section#tour {
    width: 100%;
    padding: 150px 0 50px;
}
section#tour .mainTtl {
    line-height: 1;
    text-align: center;
    padding: 0 0 50px;
}
section#tour .mainTtl .en {
    color: #00B8CE;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 4vw, 60px);
    font-weight: 700;
    letter-spacing: 0.2em;
    --spacing: 0.2em;
    text-indent: 0.2em;
    margin: 0 0 15px;
}
section#tour .mainTtl .jp {
    font-size: 24px;
    text-indent: 0.1em;
}

section#tour ul.archive {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
section#tour ul.archive::after {
    content: "";
    display: block;
    width: 30%;
}
section#tour ul.archive li {
    position: relative;
    width: 30%;
    margin: 0 0 75px;
}
section#tour ul.archive li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
section#tour ul.archive li figure {
    overflow: hidden;
    margin: 0 0 25px;
}
section#tour ul.archive li figure img {
    width: 100%;
    height: auto;
    transition: 0.5s 0s;
}
section#tour ul.archive li:hover figure img {
    transform: scale(1.1); /* 拡大 */
}
section#tour ul.archive li p,
section#tour ul.archive li dl {
    line-height: 1.5;
    transition: 0.5s 0s;
}
section#tour ul.archive li p.ttl {
    padding: 0 0 25px;
}
section#tour ul.archive li:hover p,
section#tour ul.archive li:hover dl {
    color: #CBAF71;
}
section#tour ul.archive li dl {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 13.5px;
}
section#tour ul.archive li dl dt {
    width: 60px;
    background: #00B8CE;
    color: #FFF;
    text-align: center;
    text-indent: 0.1em;
    transition: 0.5s 0s;
}
section#tour ul.archive li:hover dl dt {
    background: #CBAF71;
}
section#tour ul.archive li dl dd {
    width: calc(100% - 75px);
}

@media screen and (max-width: 960px) {
section#tour {
    width: 100%;
    padding: 100px 0 50px;
}
section#tour .mainTtl {
    line-height: 1;
    text-align: center;
    padding: 0 0 25px;
}
section#tour .mainTtl .en {
    color: #00B8CE;
    font-family: "Montserrat", sans-serif;
    font-size: 36px;
    font-weight: 700;
    letter-spacing: 0.2em;
    --spacing: 0.2em;
    text-indent: 0.2em;
    margin: 0 0 10px;
}
section#tour .mainTtl .jp {
    font-size: 16.5px;
    text-indent: 0.1em;
}

section#tour ul.archive {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}
section#tour ul.archive::after {
    content: "";
    display: block;
    width: 100%;
}
section#tour ul.archive li {
    position: relative;
    width: 47.5%;
    margin: 0 0 25px;
}
section#tour ul.archive li a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
section#tour ul.archive li figure {
    overflow: hidden;
    margin: 0 0 15px;
}
section#tour ul.archive li figure img {
    transition: 0.5s 0s;
}
section#tour ul.archive li:hover figure img {
    transform: scale(1.1); /* 拡大 */
}
section#tour ul.archive li p,
section#tour ul.archive li dl {
    line-height: 1.5;
    transition: 0.5s 0s;
}
section#tour ul.archive li p.ttl {
    padding: 0 0 15px;
}
section#tour ul.archive li:hover p,
section#tour ul.archive li:hover dl {
    color: #CBAF71;
}
section#tour ul.archive li dl {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: space-between;
    font-size: 12px;
}
section#tour ul.archive li dl dt {
    width: 60px;
    background: #00B8CE;
    color: #FFF;
    text-align: center;
    text-indent: 0.1em;
    margin: 0 0 5px;
    transition: 0.5s 0s;
}
section#tour ul.archive li:hover dl dt {
    background: #CBAF71;
}
section#tour ul.archive li dl dd {
    width: 100%;
}
}