/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@media screen and (min-width: 769px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が768pxまでの場合のスタイル記入〜
}
/*===============================================
●tablet.css 画面の横幅が768pxまで
===============================================*/
@media screen and (max-width: 768px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が768pxまでの場合のスタイル記入〜
}
/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
〜以下、画面の横幅が640pxまでの場合のスタイル記入〜
}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

.header
{
	border-bottom: 3px solid #888 ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	padding: 1em 0 ;			/* 上下の余白 */
	margin-bottom: 2em ;			/* 他のブロックとのスペース */
	background: #ffffff ;			/* 背景色(確認用) */
}

/* ロゴ画像を囲むh1 */
.logo-wrapper
{
	margin: 0 ;
	padding: 0 ;
	line-height: 1 ;
}

/* ロゴ画像 */
.logo
{
	width: 764px ;
	height: auto ;
}



/* フッター */
.footer
{
	border-top: 3px solid #888 ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	margin-top: 2em ;			/* 他のブロックとのスペース */
	padding: 1em 0 ;			/* 上下の余白 */
	background: #ffffff ;
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.wrapper
{
	width: auto ;
	margin: 0 auto ;		/* 左右に[auto]を指定することで、真ん中に寄る */
	padding: 0 ;			/* 上下左右の余白を0にしておく */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:960px)
{
	.wrapper
	{
		width: auto ;
		padding: 0 10px ;
		text-align: center ;			/* テキスト、画像の真ん中寄せ */
	}
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
{
	width:  auto ;
	padding: 20px ;					/* 上下左右に20pxの余白 */
	border: 1px solid rgba(0,0,0,.1) ;		/* 枠線 */
}



/* スマホだけに適用するCSS */
@media screen and (max-width:960px)
{
	.main
	{
		width: auto ;
		padding: 0 ;		/* 余白 */
		border: none ;		/* 枠線 */
	}


}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
{
	float: left ;		/* 左に寄せる */
}



/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
	.main
	{
		float: none ;
	}
}

.wrapper
{
	overflow: hidden ;
}

.container    { display: flex; width: 100%; height: auto; align-items: center; box-sizing: border-box; justify-content: center   }

.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* 電話 */

.reserve         { position: fixed; z-index: 2; top: 280px; left: 0; width: 40px }

.reserve img {
	border: none
}

a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);/*IE6,IE7*/
	-ms-filter:"alpha(opacity=70)";/*IE8*/
	zoom:1;
}
/* ネット予約 */

.reserve2          { position: fixed; z-index: 2; top: 330px; left: 0; width: 40px }

.reserve2 img {
	border: none
}

a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);/*IE6,IE7*/
	-ms-filter:"alpha(opacity=70)";/*IE8*/
	zoom:1;
}
/* LINE予約 */

.reserve3          { position: fixed; z-index: 2; top: 380px; left: 0; width: 40px }

.reserve3 img {
	border: none
}

a:hover img {
	opacity:0.7;
	filter:alpha(opacity=70);/*IE6,IE7*/
	-ms-filter:"alpha(opacity=70)";/*IE8*/
	zoom:1;
}


/*ヘッダーまわりはサイトに合わせて調整してください*/
header {
  padding:10px;
  background: skyblue;
}

footer  { background: #87ceeb; margin-top: 12px; padding: 10px }

#nav-drawer {
  position: relative;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 3px;/*線の太さ*/
  width: 25px;/*長さ*/
  border-radius: 3px;
  background: #555;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 220px;/*最大幅（調整してください）*/
  height: 100%;
  background: #fff;/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
/*チェックが入ったらもろもろ表示*/
ul#yoyo10 li{
        margin-top: 10px;
        margin-bottom: 10px;
    }
    /*幅*/
    /*チェックが入ったらもろもろ表示*/
ul#yoyo11 li { list-style-type: disc; margin-top: 10px; margin-bottom: 10px; margin-left: 20px }
    /*幅*/
@media screen and (min-width:1500px) {
  #nav-open {
    display:none;
  }
}
/*ボタン*/

.btn-flat-simple {
  position: relative;
  display: inline-block;
  font-weight: bold;
  padding: 0.25em 0.5em;
  text-decoration: none;
  color: #00BCD4;
  background: #ECECEC;
  transition: .4s;
}

.btn-flat-simple:hover {
  background: #00bcd4;
  color: white;
}


/* パソコンではタイル型で表示 */
.slide-wrap {
  background-color: #ccc;
  display: flex;
  margin: 0 auto;
  max-width: 1080px;
  width: 100%;
}
.slide-box {
  height: auto;
  margin-right: 1%;
  width: 24%;
}
.slide-box32 {
  height: auto;
  margin-right: 1%;
  width: 32%;
}
/* サムネイルとタイトルのスタイル調整 */
.slide-box a {
  background-color: #fff;
  color: #222;
  display: block;
  text-decoration: none;
}
.slide-box img {
  display: block;
  height: auto;
  width: 100%;
}
.slide-box p {
  font-weight: bold;
  padding: 10px;
}
@media screen and (max-width: 479px) {
/* スマホではスライダーで表示 */
  .slide-wrap {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    overflow-scrolling: touch;
  }
  .slide-box {
    flex: 0 0 90%;
  }
}
/* サムネイルとタイトルのスタイル調整 */
.slide-box32 a {
  background-color: #fff;
  color: #222;
  display: block;
  text-decoration: none;
}
.slide-box32 img {
  display: block;
  height: auto;
  width: 100%;
}
.slide-box32 p {
  font-weight: bold;
  padding: 10px;
}
@media screen and (max-width: 479px) {
/* スマホではスライダーで表示 */

  .slide-box32 {
    flex: 0 0 90%;
  }
}
*, *:before, *:after {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
ol, ul   { list-style: none }

a {
	text-decoration: none;
	color: inherit;
}
.cp_cont {
	height: 65vh;
}
.cp_offcm01 {
	position: absolute;
	top: 20px;
	right: 20px;
	display: inline-block;
}
img.sample {min-width: 100px;}



/* menu */
.cp_offcm01 .cp_menu {
	position: fixed;
	top: 0;
	right: -100vw;
	width: 250px;
	height: 100%;
	cursor: pointer;
	-webkit-transition: 0.53s transform;
	        transition: 0.53s transform;
	-webkit-transition-timing-function: cubic-bezier(.38,.52,.23,.99);
	        transition-timing-function: cubic-bezier(.38,.52,.23,.99);
	background-color: #607D8B;
	opacity: 0.8;
}
.cp_offcm01 .cp_menu ul {
	margin: 0;
	padding: 0;
}
.cp_offcm01 .cp_menu li {
	list-style: none;
}
.cp_offcm01 .cp_menu li a {
	display: block;
	padding: 20px;
	text-decoration: none;
	color: #ffffff;
	border-bottom: 1px solid #ffffff;
}

.cp_offcm01 #cp_toggle01 {
	position: absolute;
	display: none;
	opacity: 0;
}
.cp_offcm01 #cp_toggle01:checked ~ .cp_menu {
	-webkit-transform: translateX(-100vw);
	        transform: translateX(-100vw);
}
/* menu toggle */
.cp_offcm01 #cp_toggle01 ~ label {
	display: block;
	padding: 0.5em;
	cursor: pointer;
	-webkit-transition: 0.5s transform;
	        transition: 0.5s transform;
	-webkit-transition-timing-function: cubic-bezier(.61,-0.38,.37,1.27);
	        transition-timing-function: cubic-bezier(.61,-0.38,.37,1.27);
	text-align: center;
	color: #333333;
}
.cp_offcm01 #cp_toggle01:checked ~ label {
	-webkit-transform: translateX(-250px);
	        transform: translateX(-250px);
}
.cp_offcm01 #cp_toggle01 ~ label::before {
	font-family: "Font Awesome 5 Free";
	content: '\f0c9';
	font-size: 2em
}
.cp_offcm01 #cp_toggle01:checked ~ label::before {
	content: '\f00d';
}
/* contents */
.cp_contents {
	color: #333333;
	text-align: center;
}


/*ボタン正方形*/
.new_bot_ton_x                 { color: #666666; font-weight: normal; text-decoration: none; background: #139702 50% top; display: inline-block; margin: 5px auto; padding: 15px; position: relative; width: auto; float: left; border: solid 2px #3c942f; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc )  ; border-radius: 15px  ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6')   ;width:80%; min-width:240px; max-width:1000px;                          }
.new_bot_ton_x:hover    { background: #771c43 50% top; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF5F2', endColorstr='#ffffff')   }.new_bot_ton_x:active {
	position:relative;
	top:1px; behavior: url( http://newagetravellers.com/css/PIE.htc ) 
}

/*ボタン正方形2*/
.new_bot_ton_z                 { color: #666666; font-weight: normal; text-decoration: none; background: #9cf 50% top; display: inline-block; margin: 5px auto; padding: 15px; position: relative; width: auto; float: left; border: solid 2px #445ce5; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc )  ; border-radius: 15px  ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6')   ;width:80%; min-width:240px; max-width:1000px;                          }
.new_bot_ton_z:hover    { background: #771c43 50% top; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF5F2', endColorstr='#ffffff')   }.new_bot_ton_z:active {
	position:relative;
	top:1px; behavior: url( http://newagetravellers.com/css/PIE.htc ) 
}
/* ここまで*/
                                                    
  /*ボタン正方形*/
.new_bot_ton_y                       { color: #666666; font-weight: normal; text-decoration: none; background: #004a72 50% top; display: inline-block; margin-right: 10px; margin-bottom: -120px; margin-left: 5px; padding-top: 15px; position: relative; width: 170px; height: 165px; float: left; border: solid 2px #11110e; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc )  ; border-radius: 15px  ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6')                     }

.new_bot_ton_y:hover     { background: #771c43 50% top; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF5F2', endColorstr='#ffffff')    }.new_bot_ton_y:active {
	position:relative;
	top:1px; behavior: url( http://newagetravellers.com/css/PIE.htc ) 
}
/* ここまで*/

/* BOX*/
.ns4adg                                         
 { font-size: 18px; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; display: inline; margin: 5px auto; padding: 15px; position: relative; width: 1000px; float: left; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999    }

.n45                                                        
         { font-size: 16px; line-height: 180%; background: #fcf4e2 url('(EmptyReference!)'); text-align: left; display: inline; margin: 5px auto; padding: 5px; position: relative; width: auto; float: right; border: solid 2px #004a72; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999            }

.n45 a                                                                                          { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: auto; behavior: url( http://newagetravellers.com/css/PIE.htc )    }
   
.n45 a.inlink  { position: relative; z-index: 2; height: auto }  

.n43                                                                                                                                   { font-size: 16px; line-height: 180%; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: left; display: inline; margin: 5px auto; padding: 5px; position: relative; width: 700px; float: left; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999                }

.n43 a                                                                                          { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: auto; behavior: url( http://newagetravellers.com/css/PIE.htc )    }
   
.n43 a.inlink  { position: relative; z-index: 2; height: auto }  

.n44                                                                                                                                   { font-size: 16px; line-height: 180%; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: left; display: inline; margin: 5px auto; padding: 5px; position: relative; width: auto; float: left; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               ; 　flex-direction: column }

.n44 a                                                                                          { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: auto; behavior: url( http://newagetravellers.com/css/PIE.htc )    }
   
.n44 a.inlink  { position: relative; z-index: 2; height: auto }  

/* float解除 */
.n431                                                                                                                           { font-size: 16px; line-height: 180%; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: left; margin: 5px auto; padding: 5px; position: relative; width: 700px; float: none; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               }

.nblog                                                                                                                           { font-size: 16px; line-height: 180%; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: left; margin: 5px auto; padding: 5px; position: relative; width: 700px; float: none; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               }

.nblog img  {width: 100px  }


.n441                                                                                                                                      { font-size: 16px; line-height: 180%; background-color: #fff; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; text-align: left; margin: 5px auto; padding: 5px; position: relative; width: auto; float: none; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               ; 　flex-direction: column    }
.n4410                                                                                                                                       { font-size: 16px; line-height: 180%; background: #fff url(../photo/biyouinn/bck10.jpg); text-align: left; margin: 5px auto; padding: 5px; position: relative; width: auto; float: none; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               ; 　flex-direction: column     }

.n451                                                        
           { font-size: 16px; line-height: 180%; background: #fcf4e2 url('(EmptyReference!)'); text-align: left; margin: 5px; padding: 5px; position: relative; width: auto; float: right; border: solid 2px #004a72; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999              }
           
 .n46                                                        
               { font-size: 16px; line-height: 180%; background: #fcf4e2 url('(EmptyReference!)'); text-align: left; margin-top: 5px; margin-bottom: 5px; padding: 3px; position: relative; width: auto; float: right; border: solid 1px #004a72; -moz-border-radius: 10px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 10px   ; box-shadow: inset 0 1px 3px #999                  }          
           

.n4511                                                        
                  { font-size: 16px; line-height: 180%; background: #fcf4e2 url('(EmptyReference!)'); text-align: left; margin-top: 5px; margin-bottom: 5px; margin-left: 6px; position: relative; width: auto; float: right; border: solid 1px #004a72 }
              
 .n4512                                                       
                   { font-size: 16px; line-height: 180%; background: #fcf4e2 url('(EmptyReference!)'); text-align: left; margin-top: 5px; margin-right: 6px; margin-bottom: 5px; position: relative; width: auto; float: left; border: solid 1px #004a72 }    
                   
 
 .n471                                                        
           { font-size: 16px; line-height: 180%; background: #fff url('(EmptyReference!)'); text-align: left; margin: 5px; padding: 5px; position: relative; width: auto; float: right; border: solid 2px #004a72; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999              }   
           
           
  .n472                                                        
           { font-size: 16px; line-height: 180%; background: #fff url('(EmptyReference!)'); text-align: left; margin: 5px; padding: 5px; position: relative; width: auto; float: left; border: solid 2px #004a72; -moz-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999              }                          
                            

.n3cl                                                                                                                     { color: #fff; font-size: 12px; font-family: "PT Mono"; background-repeat: no-repeat; background-attachment: scroll; background-position: 10px 20px; display: inline; margin: 80px 5px 6px 30px; padding-bottom: 0; padding-left: 20px; position: relative; width: auto; height: auto; float: left;              }

.n3cl2                                                                                    { font-size: 15px; background-image: url(../photo/biyouinn/newagetravellers_logo.png); background-repeat: no-repeat; background-position: 10px 20px; text-indent: 100%; white-space: nowrap; display: inline; margin: 15px 5px 6px; padding-top: 0; padding-bottom: 0; padding-left: 0; position: relative; width: 333px; height: 111px; float: left; overflow: hidden; border-width: 1px; border-color: #555; -moz-border-radius: 15px; -webkit-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px    }                                                                                               

.n23    { background: #fff url(../photo/biyouinn/newagetravellers.jpg) no-repeat 30px 5px; margin: 0 0 0 10px; padding: 5px 0 10px 9px; position: relative; width: auto; height: auto; float: left; border: solid 1px #fcf9f9; -moz-border-radius: 15px; -moz-box-shadow: 0 0 2px #666; -webkit-border-radius: 15px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px ; box-shadow: 0 0 2px  #666 ; webkit-box-shadow: 0 0 2px #666　 }

.n834                                                                                                                                      { font-size: 16px; line-height: 180%; background: #fff url(../photo/biyouinn/newagetravellers.jpg) no-repeat; text-align: left; margin: 5px auto; padding: 5px; position: relative; width: auto; float: none; border: solid 2px #004a72; -moz-border-radius: 15px; -moz-box-shadow: inset 0 1px 5px #999; -webkit-border-radius: 15px; -webkit-box-shadow: inset 0 1px 5px #999; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 15px   ; box-shadow: inset 0 1px 5px #999               ; 　flex-direction: column    }




@import url(https://fonts.googleapis.com/css?family=Sofia&display=swap);
@import url(https://fonts.googleapis.com/css?family=Lily+Script+One&subset=latin-ext,latin&display=swap);
@import url(https://fonts.googleapis.com/css?family=PT+Mono&display=swap);
@import url(https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700&display=swap);
@import url(https://fonts.googleapis.com/css?family=Donegal+One&display=swap);
@import url(https://fonts.googleapis.com/css?family=Elsie:400,900&display=swap);

.FF0  { color: #333333; font-weight: normal; line-height: 30px; display: inline; padding-top: 1em }
.FF1  { font-family: "PT Mono" }
.FF2  { font-family: "Libre Baskerville" }
.FF3 { font-family: "Donegal One" }
.FF4  { font-family: "Elsie" }
.FF5  { font-family: "latin" }
.FF6  { font-family: "Sofia" }
.FF7  { font-family: 'Fredericka the Great', cursive }


p         { color: #1b1353 }

a  { text-decoration: none; overflow: hidden; outline-style: none; outline-color: invert }
a:link   { color: #004a72; overflow: hidden; outline-style: none; outline-color: invert } 
 a:visited     { color: #004a72; overflow: hidden; outline-style: none; outline-color: invert } 
 a:hover       { color: #1bacdc; overflow: hidden; outline-style: none; outline-color: invert }
 a:active     { color: #5e2e77; overflow: hidden; outline-style: none; outline-color: invert }
 
strong     { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal; font-stretch: normal }
em    { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal; font-stretch: normal }
.box-6    { font-size: 10px; background: #fff6e2; display: inline; margin: 10px; padding: 10px; width: 500px; height: 300px; float: left; border: dashed 1px #f90; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px  ;   position:relative;   behavior: url( http://newagetravellers.com/css/PIE.htc ) ;
               }
.box-4         { font-size: 10px; background: #fff6e2; display: inline; margin: 10px; padding: 10px; width: 596px; height: 1200px; float: left; border: solid 1px #f96; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px    ;   position:relative;   behavior: url( http://newagetravellers.com/css/PIE.htc ) ;                 }
.example                            { background-color: #fff; margin: 0 auto 0 10px; padding: 5px; position: relative; width: 525px; height: 520px; border: solid 1px #aaa; -moz-border-radius: 10px; -webkit-border-radius: 10px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 10px           }

.example1                    { color: #1b1353; font-size: 22px; font-family: "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-weight: 600; line-height: 30px; display: inline; padding-top: 1em; text-shadow: 2px  3px 3px #666               }
.example2                             { color: #ff3d59; font-weight: 600; text-align: center; display: inline; padding-top: 1em; text-shadow: 0px  0px 1px #999                      }
.example3                           { color: #ff3d59; font-weight: 600; text-align: center; display: inline; padding-top: 1em }


.pri1                   { color: #333333; font-size: 30px; font-family: "Libre Baskerville"; font-weight: normal; line-height: 30px; display: inline; padding-top: 1em }
.pri2                          { color: #333333; font-size: 20px; font-family: "Libre Baskerville"; font-weight: 400; line-height: 30px; display: inline; padding-top: 1em }
.pri20 { color: #333333; font-size: 20px; font-family: 'Fredericka the Great', cursive; font-weight: normal; line-height: 30px; display: inline; padding-top: 1em }
.pri2a                         { color: #333333; font-family: "Libre Baskerville"; font-weight: normal; display: inline; padding-top: 1em }
.pri3                      { font-family: "Donegal One"; font-weight: normal; display: inline; padding-top: 1em }
.pri4                    { color: #555; font-size: 20px; font-family: "Elsie"; font-weight: normal; line-height: 30px; display: inline; padding-top: 1em }
.pri5                     { font-family: "Libre Baskerville"; font-style: italic; font-weight: normal; line-height: 30px; display: inline; padding-top: 1em ; }
.pri6                     { font-family: "Libre Baskerville"; font-style: italic; font-weight: normal; line-height: 20px; display: inline; padding-top: 1em ; }
.example-1                              { background-color: #fff; margin: 0 auto; padding-top: 8px; padding-right: 0; padding-bottom: 0; position: relative; width: 540px; height: 450px; border: solid 1px #aaa; -moz-border-radius: 10px; -webkit-border-radius: 10px; behavior: url( http://newagetravellers.com/css/PIE.htc ) ; border-radius: 10px         }
.box               { font-size: 10px; background: #fff; display: inline; margin: 10px 10px 0 0; padding: 10px 0 0 8px; width: 180px; height: 420px; float: left; border: solid 1px #aaa; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px    ;   position:relative;   behavior: url( http://newagetravellers.com/css/PIE.htc ) ;                       }
.box2              { font-size: 10px; background: #fff; display: inline; margin: 10px 10px 0; padding: 10px 8px 0; width: 300px; height: 420px; float: left; border: solid 1px #aaa; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px     ;   position:relative;   behavior: url( http://newagetravellers.com/css/PIE.htc ) ;                     }

.cnew { color: #aaa; font-size: 10px }
.sha{ text-shadow: 2px  2px 2px #999 }
.sha_gr{ text-shadow: 2px  2px 2px #666 }
.orange  { color: #f33 }
.pink     { color: #f2637b }
.red   { color: #ed2027 }
.green  { color: #00a474 }
.blue    { color: #0073b2 }
.yellow  { color: #f6bf00 }
.sky   { color: #1bacdc }
.ore { color: #ff6633;}
.whi  { color: #fff }
.wh     { color: #fcf1e0 }
.gr  { color: #555 }
.grr   { color: #3f221d }
.gre  { color: #4bb93b }
.re     { color: #ec3747 }
.pin { color: #ff9691 }
.bul   { color: #1b1353 }
.oreb {background-color:#F9CBA2;}
.gle  { color: #c4c4c4 }
.bulb {background-color:#B1C1D3;}
.bld  { font-weight: 600 }
.underline    { text-decoration: underline }
.F8 { font-size: 8px; }
.F10 { font-size: 10px; }
.F12 { font-size: 12px; }
.F13  { font-size: 13px; }
.F14  { font-size: 14px; }
.F15  { font-size: 15px; }
.F16 { font-size: 16px; }
.F17 { font-size: 17px; }
.F18 { font-size: 18px; }
.F19 { font-size: 19px; }
.F20 { font-size: 20px; }
.F22 { font-size: 22px; }
.F24 { font-size: 24px; }
.F30 { font-size: 30px; }
.F36 { font-size: 36px; }
.F40 { font-size: 40px; }
.F48 { font-size: 48px; }
.F64 { font-size: 64px; }
.F72 { font-size: 72px; }

.bold { font-weight:900; }
.b  { font-weight: 700 }
.line {text-decoration: underline; }
.line2 { text-decoration:line-through; }

.FT100 { line-height: 100% }
.FT110 { line-height: 110% }
.FT120 { line-height: 120% }
.FT130 { line-height: 130% }
.FT200 { line-height: 200% }
.ita { font-style: italic }

.p_l {background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #ff1493 0%) repeat scroll 0 0;}
.b_l{background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #1e90ff 0%) repeat scroll 0 0;}
.y_l {background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #ffd700 0%) repeat scroll 0 0;}
.g_l {background:rgba(0, 0, 0, 0) linear-gradient(transparent 80%, #7fff00 0%) repeat scroll 0 0;}

.breadcrumb {
  padding-left:0;
  margin-left:0;
}

.breadcrumb li{
  display:inline;/*横に並ぶように*/
  list-style: none;
  font-weight: bold;/*太字*/
}

.breadcrumb li:after{/* >を表示*/
  content: '>';
  padding: 0 3px;
  color: #555;
}

.breadcrumb li:last-child:after{
  content: '';
}

.breadcrumb li a {
    text-decoration: none;
    color: #52b5ee;/*色*/
}

.breadcrumb li a:hover {
    text-decoration: underline;
}

h1               { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal; margin-top: 1px; margin-bottom: 1px; float: left }
h2        { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal }
h3        { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal; margin: 10px 0 1px; padding-top: 1px }
h4        { color: #aaa; font-size: 10px; font-style: normal; font-weight: normal; margin: 10px 0 0; float: left }

.gmap  { padding-top: 75%; position: relative; height: 0; overflow: hidden }
.gmap iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.gmap2  { padding-top: 75%; position: relative; height: 0; overflow: hidden }
.gmap2 iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.style  { padding-top: 16%; position: relative; height: 95; overflow: hidden }
.style iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.style2   { padding-top: 30%; position: relative; height: 300px; overflow: hidden }
.style2 iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


table.sp th {/*table内のthに対して*/
  padding: 10px;/*上下左右10pxずつ*/
}

table.sp td {/*table内のtdに対して*/
  padding: 5px 10px;/*上下3pxで左右10px*/
}

.breadcrumbs {
width: auto;
padding: 7px 10px;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
border-bottom: 1px solid #EEE;
white-space: nowrap;
}
.breadcrumbs ul {
display: table;
font-size: 13px;
}
.breadcrumbs ul li {
margin: 0 10px 0 0;
font-size: 13px;
float: left;
}
.breadcrumbs ul li:first-child::before {
padding: 0 3px 0 0;
content: "\f015";
font-family: FontAwesome;
font-size: 14px;
}
.breadcrumbs ul li::before {
padding: 0 10px 0 0;
content: "\f105";
font-family: FontAwesome;
font-size: 14px;
}