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

*{
  margin: 0;
  padding: 0;
  text-decoration: none;
  list-style: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  font-family: Verdana, Arial, "Verdana", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", meiryo, "ＭＳ Ｐゴシック", sans-serif;
  color: #fff;
font-style: normal;
}
/*
html,body{
  min-width:1280px; -webkit-text-size-adjust: 100%;
}
*/
body{
  padding: 0;
  margin: 0;
  position: absolute;
  width: 100%;
  min-width:1200px;
  height: 100%;
}
.t-Mukta{
  font-family: 'Mukta', sans-serif;
}
select {
	color: #333;
}
input {
	color: #333;
}




/* =========================
  common
========================= */

.mt_10{margin-top: 10px;}
.mt_15{margin-top: 15px;}
.mt_20{margin-top: 20px;}
.mt_25{margin-top: 25px;}
.mt_30{margin-top: 30px;}


/* margin-bottom */
.mb_10{margin-bottom: 10px;}
.mb_15{margin-bottom: 15px;}
.mb_20{margin-bottom: 20px;}
.mb_25{margin-bottom: 25px;}
.mb_30{margin-bottom: 30px;}
.mb_35{margin-bottom: 35px;}
.mb_40{margin-bottom: 40px;}
.mb_45{margin-bottom: 45px;}
.mb_50{margin-bottom: 50px;}
.mb_55{margin-bottom: 55px;}
.mb_60{margin-bottom: 60px;}
.mb_70{margin-bottom: 70px;}
.mb_120{margin-bottom: 120px;}

/* padding-bottom */
.pb_10{padding-bottom: 10px; display: inline-block;}
.pb_15{padding-bottom: 15px;}
.pb_20{padding-bottom: 20px;}
.pb_25{padding-bottom: 25px;}
.pb_30{padding-bottom: 30px;}
.pb_35{padding-bottom: 35px;}
.pb_40{padding-bottom: 40px;}
.pb_45{padding-bottom: 45px;}
.pb_50{padding-bottom: 50px;}
.pb_55{padding-bottom: 55px;}
.pb_60{padding-bottom: 60px;}

.clear{
  clear: both;
  height: 1px;
  padding: 0;
  margin: 0;
}
.chu{text-align: center;
  font-size: 9px;}
.t_right{text-align: right;}
.t_center{text-align: center;}
.m_auto{margin:0 auto;}

.serif{
  /*font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;*/
  font-family: 游明朝, YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", HG明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

em,
strong{
  font-style: normal;
  font-size: 1.2em;
  letter-spacing: 0.1em;
}

a{
  /*color:rgba(210,150,148,1);*/
  text-decoration: none;
}

hr{
  border: none;
}

p,li,th,td{
    font-size: 16px;
    letter-spacing: 0.1em;
    line-height: 1.8em;
}

table{
  border-collapse: collapse;
}

/**　追記　
*********************************/
.waku{
  width: 1200px;
  display: table;
  position: relative;
  margin: 0 auto;
}
.to_top{
    position: fixed;
    z-index: 2;
    bottom: 1rem;
    right: 1rem;
}
.movie video{
  width: 100%;
}
header{
  padding-top: 30px;
  height: 160px;
  width: 100%;
  z-index: 1;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

header{
  background:url(../img/common/line_h.png)repeat-x,
  rgba(255,255,255,1);
  background-position: left top,130px 5px,center;
  animation: bgiLoop 10s linear infinite;
  z-index: 1;
}
header .nami{
  background:url(../img/common/line_h3.png)repeat-x;
  animation: bgiLoop2 10s linear infinite;
  position: absolute;
  top: 0;
  width: 100%;
  height: 30px;
  z-index: 1;
}
@keyframes bgiLoop {
    0% { background-position: 0px -3px;}
  50% { background-position: 120px 0;}
  100% { background-position: 240px -3px;}
}
@keyframes bgiLoop2 {
    0% { background-position: 0 0;}
  50% { background-position: 120px -3px;}
  100% { background-position: 240px 0;}
}

header nav{
  display: table;
  margin: 0 auto;
}
header h1{
  text-align: center;
  margin-bottom: 30px;
}
header nav li{
  float: left;
}
header nav li + li{
  margin-left: 2rem;
}
header .tel{
  position: absolute;
  right: 20px;
  top: -140px;
  transition:all .3s ease-out;
  width: 158px;
  height: 173px;
}


#index nav li:nth-child(1) img,
nav a:hover img{
  transition:all .3s ease-out;
  transform: translateY(-10px);
}
nav a img{
  transition: all 0.3s linear 0s;
}

#index nav li:nth-child(1) a{
  text-indent: -9999px;
  background:url(../img/common/nav03_on.svg)no-repeat;
  background-position: center top;
  display: inherit;
  width: 48px;
  height: 40px;
  transform: translateY(-10px);
}
#iroriya nav li:nth-child(2) a{
  text-indent: -9999px;
  background:url(../img/common/nav01_on.svg)no-repeat;
  background-position: center top;
  display: inherit;
  width: 98px;
  height: 41px;
  transform: translateY(-10px);
}
#toshokan nav li:nth-child(3) a{
  text-indent: -9999px;
  background:url(../img/common/nav02_on.svg)no-repeat;
  background-position: center top;
  display: inherit;
  width: 107px;
  height: 40px;
  transform: translateY(-10px);
}
#access nav li:nth-child(4) a{
  text-indent: -9999px;
  background:url(../img/common/nav05_on.svg)no-repeat;
  background-position: center top;
  display: inherit;
  width: 60px;
  height: 39px;
  transform: translateY(-10px);
}
#sightseeing nav li:nth-child(5) a{
  text-indent: -9999px;
  background:url(../img/common/nav04_on.svg)no-repeat;
  background-position: center top;
  display: inherit;
  width: 70px;
  height: 39px;
  transform: translateY(-10px);
}

header.is-animation{
  height: 80px;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 10;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
header.is-animation nav,
header.is-animation h1{
  float: left;
}
header.is-animation{
  padding-top: 30px;
  background:url(../img/common/line_h.png)repeat-x,
  rgba(255,255,255,.8);
}
header.is-animation h1 a{
  background: url(../img/common/h_logo01.svg)no-repeat;
  width: 272px;
  height: 36px;
  display: block;
  margin-right: 4rem;
}
header.is-animation h1 img{
  display: none;
}
header.is-animation .tel{
  top: -140px;
}
header .tel:hover img{
  display: none;
}
header .tel:hover{
  transition:all .3s ease-out;
  transform: translateY(80px);
  background: url(../img/common/h_tel2.svg)no-repeat;
}
header.is-animation .tel:hover{
  transform: translateY(10px);
  background: url(../img/common/h_tel3.svg)no-repeat;
}

/*search-----------------------*/
.search h2{
position: absolute;
    top: -70px;
}
.search h2 img{
  position: absolute;
}
.search h2 img + img{
  top: 12px;
  left:8px;
  animation:26s linear infinite rotation;
}
@keyframes rotation{
  0%{ transform:rotate(0);}
  100%{ transform:rotate(360deg); }
}

.search{
  background: url(../img/common/bg_boad.jpg)repeat-x;
  padding: 20px 0 20px;
}
.search .waku{
  max-width: 960px;
}
.plan_form{
  margin-left: 260px;
  background: rgba(255,255,255,.7);
  padding: 15px 30px;
  min-height: 136px;
  border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
border: 0px solid #000000;
}
.plan_form .search_btn,
.plan_form .middle,
.plan_form .row p{
  float: left;
}
.plan_form .row p{
  line-height: 1.6;
}
.plan_form .search_btn{
  float: right;
}
.plan_form .row p + p{
  margin-left: 2rem;
}
.plan_form .row{
  padding: 5px 0;
}
.search_btn:after,
.plan_form .row:after{
  content: '';
  clear: both;
  display: block;
}
.search_btn{
  margin-top: 7px;
}
.search_btn li input:focus{
  border: none;
}
.search_btn li{
  padding: 10px 15px 5px;
  border: solid 1px #EA5762;
  background: #dd9099;
  text-align: center;
  min-width: 100px;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px;
}
.search_btn li + li{
  margin-top: 10px;
  background: #86a2bf;
  border: solid 1px #5A8CBA;
}
.search_btn li + li:hover{
  background: #5A8CBA;
}
.search_btn li:hover{
  background: #EA5762;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
/*common--------------------------*/
h2{
  margin-bottom: 30px;
}
h3{
  margin-bottom: 1rem;
}
p{
  letter-spacing: 0.1rem;
  line-height: 2;
}
.i_parasol:before{
  content: '';
  background: url(../img/common/iro_i01.svg)no-repeat;
  width: 32px;
  height: 31px;
  display: inline-block;
  padding-right: 10px;
  position: relative;
  top: 3px;
}
.i_parasol{

}
.dot li:before{
  content: '・ ';
}

.bt_more{
  margin-top: 30px;
  position: relative;
  width: 161px;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
border: 1px solid #fff;
}
.bt_more:hover{
  background:rgba(255,255,255,.3); 
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.bt_more:after{
  content: '';
  background:url(../img/common/bt_more_ar.png)no-repeat;
  position: absolute;
  right: 20px;
  top: 20px;
  width: 7px;
  height: 11px;
  transition:all .3s ease-out;
}
.bt_more:hover:after{
  transform: translateX(5px);
  transition:all .3s ease-out;
}
.bt_more.c_b:after{
  background:url(../img/common/bt_more_ar_b.png)no-repeat;
}
.bt_more.c_b{
border: 1px solid #222;
}
.bt_more.c_bl:after{
  background:url(../img/common/bt_more_ar_bl.png)no-repeat;
}
.bt_more.c_bl{
border: 1px solid #5A8CBA;
}
.c_kuro address,
.c_kuro h4,.c_kuro h3,.c_kuro h5,
.c_kuro dd,
.c_kuro dt,
.c_kuro a,
.c_kuro li,
.c_kuro p{
  color: #222;
}
.title_umi{
  background:url(../img/common/t_nami01.png)no-repeat;
  background-position: center bottom;
  animation: title_umi2row 3s linear infinite;
  padding-bottom: 30px;
  position: relative;
  margin-bottom: 30px;
}
@keyframes title_umi2row {
    0% { background-position: 20px 88px;}
  50% { background-position: 20px 78px;}
  100% { background-position:  20px 88px;}
}
.title_umi:after{
  content: '';
  background:url(../img/common/t_nami02.png)no-repeat;
  width: 70px;
  height: 13px;
  position: absolute;
  bottom: 0;
  left: 50px;
  animation: title_umi2rowa 3.3s linear infinite;
}
.title_umi:before{
  content: '';
  background:url(../img/common/t_nami03.png)no-repeat;
  width: 18px;
  height: 10px;
  position: absolute;
  bottom: 0;
  left: 130px;
  animation: title_umi2rowb 3.1s linear infinite;
}
@keyframes title_umi2rowb {
    0% {transform: translateY(0px);}
  50% {transform: translateY(-7px);}
  100% {transform: translateY(0px);}
}
@keyframes title_umi2rowa {
    0% {transform: translateY(-7px);}
  50% {transform: translateY(0px);}
  100% {transform: translateY(-7px);}
}

#plans{
  background:#fff;
  padding: 70px 0; 
}
.plan_box{
  display: table;
  margin: 0 auto;
}
.plan_box:after{
  content: '';
  clear: both;
  display: block;
  }
#plans h3{
  text-align: center;
}
#plans .aplan+.aplan{
  margin-left: 17px;
}
#plans .aplan{
  float: left;
  position: relative;
  border:solid 1px #ddd;
  padding: 28px;
-webkit-box-shadow: 3px 6px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 3px 6px 5px 0px rgba(0,0,0,0.3);
box-shadow: 3px 6px 5px 0px rgba(0,0,0,0.3);
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
#plans .aplan:hover{
  transform: translateY(-10px);
  transition: all 0.3s linear 0s;
}

#plans .aplan:before{
  content: '';
  background:url(../img/common/i_plan_ar.svg)no-repeat;
  width: 43px;
  height: 10px;
  position: absolute;
  right: 28px;
  top: 40px;
  transition: all 0.3s linear 0s;
}
#plans .aplan:hover:before{
  transform: translateX(10px);
  transition: all 0.3s linear 0s;
}
#plans .aplan li{
  max-width: 300px;
}
#plans .aplan .title{
  margin-bottom: 15px;
}
#plans .aplan .ph{
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
#plans .aplan .ph:hover{
  opacity: .7;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.bn_1100{
  margin-top: 50px;
  text-align: center;
}
.hover7{
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  }
.hover7:hover{
  opacity: .7;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  }


/*--------------------------*/
.h_image h2{
  text-align: center;
  margin-bottom: 0;
}

.h_image{
  min-height: 450px;
  padding: 180px 0 0;
  line-height: 0;
}
.h_image.bg-slider {
  background-position:center center;
  background-size: cover;
  align-items: center;
  justify-content: center;
}
#iroriya .h_image{
  background:url(../img/head/head_iro.jpg)no-repeat;
  background-position: center;
}
#toshokan .h_image{
  background:url(../img/head/head_tosho.jpg)no-repeat;
  background-position: center;
  background-size: cover;
}
#sightseeing .h_image{
  background:url(../img/head/head_image04.jpg)no-repeat;
  background-position: center -80px;
  background-size: cover;
}
#access .h_image{
  background:url(../img/head/head_si.jpg)no-repeat;
  background-position: center;
  background-size: cover;
}
/*--------------------------*/
#aboutus .tx_box{
  margin: 100px 0 100px 50px;
}

#aboutus{
  background: url(../img/index/bg_sea.jpg)no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 500px;
}
#aboutus p{
  color: #222;
}
#index #main{
  background: url(../img/index/bg_mokume.jpg)repeat;
  background-position: center top;
}
#index #main .tx_box{
  width: 450px;
}
#index #main .tx_box.pl_80{
  padding-left: 50px;
  width: 550px;
}
.f_right{
  float: right;
}
#index #main section:after{
  content: '';
  clear: both;
  display: block;
}
#index #main section{
  background: url(../img/index/main_bg01.jpg)no-repeat;
  background-position: center top;
  min-height: 679px;
  padding-top: 100px;
}
#index #main section+section{
  background: url(../img/index/main_bg02.jpg)no-repeat;
  background-position: center top;
  padding-top: 100px;
  min-height: 529px;
}
#index #main section+section+section{
  background: url(../img/index/main_bg03.jpg)no-repeat;
  background-position: center top;
  padding-top: 100px;
  min-height: 692px;
}



/*--------------------------*/
footer{
  background: url(../img/common/bg_footer.jpg)no-repeat;
  background-position: center top;
  background-size: cover;
  padding: 100px 0 30px;
}
footer .bn:after{
  content: '';
  clear: both;
  display: block;
}
footer address,
footer .bn ul{
  float: left;
}
footer .bn{
  float: right;
}
footer .bn ul+ul{
  margin-left: 50px;
}
footer .yashi li{
  font-size: .85rem;
  line-height: 2.5;
}

.yashi li{
  background:url(../img/common/i_yashi_s.png)no-repeat;
  background-position: left top;
  background-size: 34px;
  min-height: 44px;
  padding-bottom: 10px;
  padding-left: 44px;
  border-bottom: solid 1px #fff;
  margin-bottom: 15px;
  position: relative;
    -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.yashi li:hover a{
  color: #5A8CBA;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

/*iroriya--------------------------*/
#iroriya #main .sec01{
  background:url(../img/iroriya/bg_irori01.jpg)no-repeat,url(../img/index/bg_mokume.jpg)repeat;
  background-position: left -1px;
  height: 1444px;
  padding-top: 120px;
}
#iroriya #main .sec01 .tx_box{
  margin-left: 60px;
  margin-bottom: 50px;
}

#iroriya #main .sec02{
  background:url(../img/iroriya/bg_irori02.jpg)no-repeat,url(../img/index/bg_mokume.jpg)repeat;
  background-position: left top;
  height: 706px;
}
#iroriya #main h3{
  margin-bottom: 50px;
}
#iroriya #main .col02{
  max-width: 1100px;
  margin: 0 auto;
}
.col02:after{
  content: '';
  clear: both;
  display: block;
}
.meal{
  float: left;
}
.meal+.meal{
  float: right;
}
.meal .ph{
  position: relative;
  transform: rotate(5deg);
-webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
line-height: 0;
}
.meal .ph:after{
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 500px;
  height: 340px;
  background: url(../img/common/bg_broun.jpg);
  z-index: -1;
  transform: rotate(-5deg);
}
.menu{
  background: url(../img/iroriya/iro_menu.png)no-repeat;
  background-position: center;
  padding: 50px 0;
  min-height: 41px;
}
.i_leaf{
  position: relative;
  margin-top: 10px;
}
.i_leaf:before{
  content: '';
  background: url(../img/common/i_leaf.svg)no-repeat;
  background-position: center;
  width: 87px;
  height: 56px;
  display: inline-block;
  padding-right: 20px;
  position: relative;
  top: 20px;
}
.w760{
  max-width: 760px;
  margin: 0 auto;
}
.accordion1 {text-align: center;
  padding: 70px 0;
  position: relative;
  z-index: 2;
}
.accordion1 .inner {display: none;
  padding: 60px 0 50px;
  background:url(../img/iroriya/bg_oshinagaki.png)no-repeat;
  background-position: center top;
}
.accordion1 p{cursor: pointer; 
  padding: 10px;}
.accordion1 .inner li{
  color: #222;
    width: 80%;
    display: table;
    margin: 0 auto;
    padding:7px 0;
}
.accordion1 .inner .b_line{
  border-bottom: solid 1px #c3a95d;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
.accordion1 .inner h4{
  color: #222;
    font-weight: normal;
    font-size: 1.5rem;
    margin-bottom: 20px;
}
.accordion1 .inner h4 span{
  display: block;
  font-size: .85rem;
  color: #222;
}

.accordion1 .ac1{
  background:url(../img/common/bt_plus.png)no-repeat;
  background-position: center;
  min-height: 70px;
  text-indent: -9999px;
  margin-bottom: 20px;
}

.col02 .accordion1{
  width: 500px;
  float: left;
}
#rice h3{
  position: relative;
}
#rice h3 span{
  position: absolute;
  right: 0;
  top: 20px;
  font-size: .85rem;
  font-weight: normal;
  width: 240px;
  display: block;
  line-height: 1.5;
}

/*--------------------------*/
.manaita{
  background:url(../img/iroriya/bg_irori03.jpg)no-repeat,
  url(../img/iroriya/bg_ita.jpg)repeat,#ecd0b3;
  background-position: center;
  height: 1240px;
  padding:100px 0;
}
.manaita .sake:after{
  content: '';
  clear: both;
  display: block;
}
.manaita .sake{
  margin-bottom: 50px;
}
.manaita .sake ul,
.manaita .sake h3{
  float: left;
}
.manaita .sake h3{
  margin-right: 50px;
}
.manaita .sake ul+ul{
  margin-left: 30px;
}
.manaita .sake ul li:first-child{
  -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.5);
box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.5);
line-height: 0;
transform: rotate(3deg);
}
.manaita .col02{
  max-width: 1100px;
    margin: 140px auto 0;
}

.col02 .col01{
  float: left;
  position: relative;
}
.col02 .col01 + .col01{
  margin-left: 80px;
}
.illu01{
  position: absolute;
  top: 50px;
  right: 30px;
}
.bg_ozabu .ph{
  position: relative;
  transform: rotate(5deg);
-webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.5);
line-height: 0;
}
.bg_ozabu .ph:before{
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 500px;
  height: 340px;
  background: url(../img/common/bg_broun.jpg);
  z-index: -1;
  transform: rotate(-5deg);
}

#acdemo4 .accordion1{
  padding-top: 30px;
}
.accordion1 h5{
  font-size: 1rem;
}
.accordion1 h5:after,
.accordion1 h5:before{
  content: ' ・ ';
}
#acdemo4 .accordion1 .inner li{
    padding:3px 0;
}
#othermeal{
  padding:150px 0 100px;
  background:url(../img/iroriya/kumo01.png)no-repeat,
  url(../img/iroriya/kumo02.png)no-repeat,
  #fff;
  background-position: 100px 50px, 100% 16% ;
  animation: bgiLoop100 40s linear infinite;
}
@keyframes bgiLoop100 {
    0% { background-position: -30% 100px;}
    10%{opacity: 1;}
    90%{opacity: 1;}
  100% { background-position: 130% 100px;}
}

#othermeal .waku:after{
  content: '';
  width: 158px;
  height: 98px;
  background:url(../img/iroriya/kumo03.png)no-repeat;
  display: block;
  position: absolute;
  right: 5%;
  top: -80px;
  animation: bgiLoop80 20s linear infinite;
  z-index: -1;
}
@keyframes bgiLoop80 {
    0% { opacity: 0;transform: translate(-700px, 50px);}
    10%{opacity: 1;}
    90%{opacity: 1;}
  100% {opacity: 0;transform: translate(-0px, 50px); }
}

.w1100{
  width: 1100px;
  margin: 0 auto;
}
#othermeal section:after{
  content: '';
  clear: both;
  display: block;
}
#othermeal .bg_ami{
  float: left;
  background:url(../img/iroriya/bg_amiami01.png)no-repeat;
  background-position: center top;
  padding: 60px 80px 0;
  width: 505px;
  height: 513px;
}
#othermeal .bg_ami li{
  padding:3px 0;
}
#othermeal .bg_ami +  .bg_ami{
  float: right;
  background:url(../img/iroriya/bg_amiami02.png)no-repeat;
}
#othermeal .bg_ami h3{
  margin-bottom: 30px;
}
.illu li{
  position: absolute;
}
.illu .kamome01{
  left: 0px;
  top: -50px;
  animation: vertical 1s ease-in-out infinite alternate;
}
.illu .kamome02{
  left: 120px;
  top: -80px;
  animation: vertical 1.3s ease-in-out infinite alternate;
}
@keyframes vertical {
    0% { transform:translateY(-10px); }
  100% { transform:translateY(  0px); }
}



/*--------------------------*/
.bg_beach{
  background:url(../img/toshokan/bg_sunahama02.jpg)no-repeat,
  url(../img/toshokan/bg_sunahama03.jpg)no-repeat,
  url(../img/toshokan/bg_sunahama01.jpg)repeat;
  min-height: 1500px;
  background-position: center top,center bottom,center;
  padding: 100px 0;
}

.bg_beach .sec01{
  margin-left: 50px;
  width: 500px;
  margin-bottom: 120px;
}
.bg_beach .sec02{
  position: relative;
}
.bg_beach .sec02 .col02{
  margin-bottom: 80px;
}

.umi{
  float: left;
  max-width: 500px;
}
.umi +.umi{
  float: right;
}
.umi.only_ph .ph{
  margin-top: 50px;
}
.umi.only_ph .slides li{
  width: 500px !important;
  height: 340px;
}
.flex-direction-nav a{
    color: #fff;
}
.flex-direction-nav a.flex-next:before {
    content: '\f002';
    font-size: 1rem;
    height: 1rem;
    color: #fff;
}
.flex-direction-nav a:before {
    font-size: 1rem;
    height: 1rem;
    color: #fff;
}
.flex-control-nav{
  right: 0;
  display: table;
  width: auto;
}
.flex-control-paging li a.flex-active {
  background: #fff;
background: rgb(134, 162, 191);
  }
.flex-control-paging li a:hover {
  background: #fff;
    background: rgb(181, 220, 254);
}
.umi .ph{
  position: relative;
  transform: rotate(5deg);
line-height: 0;
display: inline-block;
}
.umi .ph:after{
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 500px;
  height: 340px;
  background: url(../img/toshokan/bg_umi.jpg);
  z-index: -1;
  transform: rotate(-5deg);
}
.i_flip{
  position: relative;
  margin-top: 10px;
  margin-bottom: 20px;
}
.i_flip:before{
  content: '';
  background: url(../img/toshokan/i_bearch.png)no-repeat;
  background-position: center;
  width: 56px;
  height: 38px;
  display: inline-block;
  padding-right: 30px;
  position: relative;
  top:10px;
}
.douretu:after{
  content: '';
  clear: both;
  display: block;
}
.douretu{
  padding-bottom: 5px;
  margin-bottom: 10px;
  border-bottom: solid 1px #ddd;
}
.douretu dd,
.douretu dt{
  float: left;
  font-size: .85rem;
}
.douretu dt{
  padding-left: 1rem;
  text-indent: -1.5rem;
  width: 7rem;
  border-right: solid 1px #ddd;
}
.douretu dt+dd{
  margin-left: 30px;
}
.douretu dt:before{
  content: '・ ';
}

/*--------------------------*/
#business{
  background: url(../img/toshokan/bg_business.jpg)no-repeat;
  background-position: center;
  background-size: cover;
  padding: 100px 0;
}
#business .tx_box{
  margin-left: 50px;
  padding: 50px;
  background:rgba(255,255,255,.7);
  max-width: 68%;
 /* border-radius: 6px 6px 6px 6px;
-moz-border-radius: 6px 6px 6px 6px;
-webkit-border-radius: 6px 6px 6px 6px;
border: 0px solid #000000;*/
-webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
}
.bg_beach .sec02 .illu{
  position: relative;
}
.bg_beach .sec02 .illu span{
  position: absolute;
  top: -300px;
  left: 0px;
  animation: kani01 12s ease -2s infinite;
}
@keyframes kani01 {
    0% {
        opacity:0;
      transform:translate(0px,0px);
    }
    10% {
      opacity:1;
      transform:translate(50px,20px);
    }
    30% {
      opacity:1;
      transform:translate(150px,70px);
    }
    50% {
      opacity:1;
      transform:translate(210px,80px);
      }
    70% {
      opacity:1;
      transform:translate(250px,70px);
      }
    100% {
      opacity:0;
      transform:translate(280px,30px);
    }
}

.bg_beach .sec02 .illu span.kani02{
  position: absolute;
  top: -200px;
  left: 50px;
  animation: kani02 12.1s ease -2s infinite;
}

@keyframes kani02 {
    0% {
        opacity:0;
        transform:translate(0px,0px);
    }
    30% {
        opacity:0;
      transform:translate(120px,30px);
    }
    50% {
      opacity:1;
      transform:translate(80px,50px);
    }
    70% {
      opacity:1;
      transform:translate(110px,60px);
    }
    80% {
      opacity:1;
       transform:translate(140px,40px);
      }
    90% {
      opacity:1;
      transform:translate(180px,20px);
      }
    100% {
      opacity:0;
      transform:translate(200px,0px);
    }
}

.bg_beach .sec02 .illu span.kani03{
  position: absolute;
  top: -180px;
  left: 80px;
  animation: kani03 20s ease -2s infinite;
}

@keyframes kani03 {
    0% {
        opacity:0;
      transform:translate(0px,0px);
    }
    20% {
        opacity:0;
      transform:translate(0px,0px);
    }
    30% {
      opacity:1;
      transform:translate(50px,20px);
    }
    50% {
      opacity:1;
      transform:translate(120px,40px);
    }
    60% {
      opacity:1;
      transform:translate(180px,30px);
      }
    80% {
      opacity:1;
      transform:translate(200px,10px);
      }
    90% {
      opacity:1;
      transform:translate(230px,0px);
    }
    100% {
      opacity:0;
      transform:translate(250px,0px);
    }
}


/*acces--------------------------*/
.map{
  background:url(../img/access/bg_sora.jpg)no-repeat;
  background-position: center top;
  background-size: cover;
  padding: 100px;
}
.map .sec01{
  position: relative;
}
.map .sec01:after{
  content: '';
  clear: both;
  display: block;
}
.map .board{
  background:url(../img/access/bg_boad.jpg)no-repeat;
  background-position: center top;
  width: 400px;
  height: 360px;
  padding: 30px 50px;
  line-height: 1;
  position: absolute;
  right: 0;
  top: 80px;
  z-index: 2;
  -webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border: 0px solid #000000;
  }
  .map .board address{
    line-height: 1.8;
    margin-top: 50px;
  }
.g_map{
  width: 70%;
  position: relative;
  z-index: 1;
}
.g_map:before{
  content: '';
  display: block;
  width: 100%;
  height: 400px;
  background:url(../img/access/bg_shadow_bl.jpg)repeat;
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: -1;
}
.rote{
  padding: 30px 0 100px;
  background: #f3eeea;
}

.rote .trance01{
  width: 30%;
  float: left;
  padding: 50px 30px;
    -webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
  -moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
  box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
  background:url(../img/access/bg_line_bl.jpg)no-repeat,#fff;
  background-position: right top;
  min-height: 1000px;
  position: relative;
}
.rote .trance01 + .trance01{
  margin-left: 5%;
}


.rote .trance01 h2,
.rote .trance01 li{
  text-align: center;
}
.rote .trance01 h2:after{
  content: '';
  background:url(../img/access/i_nami.png)no-repeat;
  background-position: center;
  display: block;
  width: 100%;
  height: 13px;
  margin-top: 15px;
  margin-bottom: 30px;
}
.rote .trance01 li:first-child{
  padding: 3px 10px;
  border:solid 1px #b5dcfe; 
  color: #86a2bf;
}
.rote .trance01 li:last-child:after{
  content: '';
  display: table;
  margin: 5px auto 0;
  width: 100px;
  height: 2px;
  background:#b5dcfe;
}
.rote .trance01 li+li:before{
  content: '|';
  display: block;width: 100%;
  text-align: center;
  color: #b5dcfe;
}

.rote .trance01 .dot{
  border:dashed 1px #b5dcfe;
  text-align: center;
  padding: 3px 10px;
  position: relative;
  background:rgba(181,220,254,.3);
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.rote .trance01 .dot:hover{
  background:rgba(181,220,254,1);
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.rote .trance01 .dot + .dot{
  margin-top: 20px;
}
.rote .trance01 .dot:before{
  content: '';
  display: block;
  width: 7px;
  height: 10px;
  position: absolute;
  left: 20px;
  top: 15px;
  background:url(../img/common/bt_more_ar_bl.png)no-repeat;
  background-position: center;
}
.rote .trance01 .dot a{
  display: inherit;
}


.l_nami{
  background:url(../img/access/i_nami2.png)no-repeat;
  background-position: center;
  height: 10px;
  width: 100%;
  margin: 50px 0;
}

h2.car:before{
  content: '';
  display: block;
  background:url(../img/access/i_car.png)no-repeat;
  background-position: center;
  width: 100%;
  height: 39px;
  margin-bottom: 20px;
}
h2.train:before{
  content: '';
  display: block;
  background:url(../img/access/i_train.png)no-repeat;
  background-position: center;
  width: 100%;
  height: 39px;
  margin-bottom: 20px;
}
h2.bus:before{
  content: '';
  display: block;
  background:url(../img/access/i_bus.png)no-repeat;
  background-position: center;
  width: 100%;
  height: 39px;
  margin-bottom: 20px;
}
.rote .trance01 .leaf{
  position: absolute;
  top: -40px;
  left: 15px;
}
.rote .trance01 .hat{
  position: absolute;
  bottom: 50px;
  right: 40px;
  z-index: 1;
}
.rote .trance01 .kani{
  position: absolute;
  bottom: 50px;
  right: 100px;
  animation: kani04 10s ease -2s infinite;
}
@keyframes kani04 {
    0% {
        opacity:0;
      transform:translate(0px,0px);
    }
    40% {
      opacity:1;
      transform:translate(-40px,20px);
    }
    50% {
      opacity:1;
      transform:translate(-60px,20px);
    }
    70% {
      opacity:1;
      transform:translate(-80px,10px);
      }
    90% {
      opacity:1;
      transform:translate(-120px,0px);
      }
    100% {
      opacity:0;
      transform:translate(-150px,-10px);
    }
}


/*--------------------------*/
#sightseeing .main{
  background:url(../img/sightseeing/bg_umi_t.jpg)no-repeat,#f3eeea;
  background-position: center top;
  padding: 100px 0 70px;
}

.spot_box{
  background:url(../img/common/bg_line_bl.jpg)no-repeat,#fff;
  background-position: right top;
  width: 580px;
  padding: 50px 30px;
-webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.4);
  float: left;
  min-height: 560px;
  margin-bottom: 50px;
  border: solid 1px #ddd;
}
.spot_box.last{
  margin-bottom: 0;
}

.spot_box:nth-child(6),
.spot_box:nth-child(4),
.spot_box:nth-child(2){
  float: right;
}

.spot_box .info dd,
.spot_box .info dt,
.spot_box .f_left{
  float: left;
}
.spot_box .title{
  margin:30px 0 ;
  min-height: 54px; 
}
.spot_box .info dt{
  width: 5rem;
}
.spot_box .f_right{
  float: right;
}
.spot_box .info:before{
  content: '';
  display: block;
  margin:15px 0;
  width: 100%;
  height: 13px;
  background:url(../img/common/i_nami.png)no-repeat;
  background-position: center;
}
.spot_box .info dl{
  margin-bottom: 10px;
}
#sightseeing .two_box:after,
.spot_box .info dl:after,
.spot_box:after{
  content: '';
  clear: both;
  display: block;
}
.spot_box .f_left,
.spot_box .ph{
  width: 240px;
}

.spot_box .f_right{
  width: 260px;
}

.spot_box .info{
  font-size: 0.85rem;
}

.spot_box .js-dropdown-btn{
  color: #86a2bf;
  padding: 15px 0;
}

.bn_1100.last{
  margin-top: 70px !important;
}
