@charset "Shift_JIS";
/*====================================================================
 common Adjust h1
====================================================================*/
div#spg-str-main div#spg h1 {
	margin-right: 0px;
	margin-left: 0px;
	margin-bottom: 0px;
}

/* -------------------------------------------------------------
    01. Float Clearing
------------------------------------------------------------- */
div#spg-str-main div#spg div.relationBox ul:after,
div#spg-str-main div#spg div.box-relation-01:after{
display:block;
clear:both;
height:0;
visibility:hidden;
content:".";
}

/* -------------------------------------------------------------
    02. hasLayout Swicth
------------------------------------------------------------- */
div#spg-str-main div#spg div.relationBox ul,
div#spg-str-main div#spg div.box-relation-01{
zoom:1;
}

/* ---------------- END for support -------------------------------- */


/*  animationTXT
--------------------------------------- */
/* 基本のスタイル */
   .foo.delighter {
      transition: all .3s ease-out;
      transform: translateX(-100%);
      opacity: 0;
   }
/* スタート時のスタイル */
   .foo.delighter.started {
      transform: none;
      opacity: 1;
   }
/* エンド時のスタイル */
   .foo.delighter.started.ended {
      border: solid red 10px;
   }

/* 右・左・下から移動・時間差 */
.delighter.right { transform:translate(-100%); opacity:0; transition: all .75s ease-out; }
.delighter.right.started { transform:none; opacity:1; }

.delighter.left { transform:translate(100%); opacity:0; transition: all .75s ease-out; }
.delighter.left.started { transform:none; opacity:1; }

.delighter.bottom { transform:translateY(40px); opacity:0; transition: all .75s ease-out; }
/* .delighter.bottom { transform:translatey(300%); opacity:0; transition: all .75s ease-out; } */
.delighter.bottom.started { transform:none; opacity:1; }

.delighter li { opacity: 0; transform: translatey(400%); transition: all .7s ease-out; }
.delighter.started li { opacity: 1; transform: none; }
.delighter.started li:nth-child(1) { transition: all .7s ease-out .1s; }
.delighter.started li:nth-child(2) { transition: all .7s ease-out .3s; }
.delighter.started li:nth-child(3) { transition: all .7s ease-out .5s; }
.delighter.started li:nth-child(4) { transition: all .7s ease-out .7s; }
.delighter.started li:nth-child(5) { transition: all .7s ease-out .9s; }
.delighter.started li:nth-child(6) { transition: all .7s ease-out 1.1s; }
.delighter.started li:nth-child(7) { transition: all .7s ease-out 1.3s; }

.delighter pre {
  /* background-color:#CC0000; */
	background: -webkit-repeating-linear-gradient(-45deg, #F1EEE7, #F1EEE7 5px, #fdfcff 5px, #fdfcff 10px);
  background: repeating-linear-gradient(-45deg, #F1EEE7, #F1EEE7 5px, #fdfcff 5px, #fdfcff 10px);
	display: block; transition: all 2s ease-out; opacity: 0;
  padding: 0;
  width: 1px; overflow: hidden;
	height: 5px;
}
.delighter.started pre {
  max-width: 99999px; width: 100%; opacity: 1;
}



/*  all-wrap
--------------------------------------- */
 div#str-contents2010{
 overflow:hidden;
 }

 div.str-contents-freeInner{
margin: 0 auto;
width: 100%;
text-align: left;
zoom: 1;
}

div#spg-str-main{
margin-top: 0;
float: none;
width: 100%;
color: #333;
line-height: 1.4;
text-align: left;
clear: both;
}

div#spg-str-main div#spg div.contents-1000px{
margin: 0 auto;
width: 1000px;
}
div#spg-str-main div#spg div.contents-960px{
margin: 0 auto;
width: 960px;
}
div#spg-str-main div#spg div.contents-800px{
margin: 0 auto;
width: 800px;
}

div#spg-str-main div#spg div.meirio-wrap{
font-family: Meiryo, sans-serif;
font-size: 16px;
}

div#spg-str-main div#spg .spg-clear{clear: both; overflow: hidden;}
div#spg-str-main div#spg .spg-fleft{float: left;}
div#spg-str-main div#spg .txt-center{text-align: center;}
div#spg-str-main div#spg .txt-right{text-align: right;}
div#spg-str-main div#spg .mg-r10{margin-right: 10px;}
div#spg-str-main div#spg .mg-r30{margin-right: 30px;}
div#spg-str-main div#spg .mg-l30{margin-left: 30px;}
div#spg-str-main div#spg .mg-t10{margin-top: 10px;}
div#spg-str-main div#spg .mg-t20{margin-top: 20px;}
div#spg-str-main div#spg .mg-t50{margin-top: 50px;}
div#spg-str-main div#spg .mg-b05{margin-bottom: 5px;}
div#spg-str-main div#spg .mg-b10{margin-bottom: 10px;}
div#spg-str-main div#spg .mg-b15{margin-bottom: 15px;}
div#spg-str-main div#spg .mg-b20{margin-bottom: 20px;}
div#spg-str-main div#spg .mg-b30{margin-bottom: 30px;}
div#spg-str-main div#spg .mg-b50{margin-bottom: 50px;}
div#spg-str-main div#spg .pd-b20{padding-bottom: 20px;}
div#spg-str-main div#spg .pd-b25{padding-bottom: 25px;}
div#spg-str-main div#spg .pd-b40{padding-bottom: 40px;}
div#spg-str-main div#spg .font-16 {font-size: 115%;}
div#spg-str-main div#spg .font-12 {font-size: 86%;}
div#spg-str-main div#spg .font-red {color: #CC0000;font-size: 115%;}



/*  hdg-l1-01
--------------------------------------- */
div#spg-str-main div#spg div.hdg-l1-01-wrap{
width: 100%;
overflow: hidden;
text-align: center;
background: url(images/hdg-l1-01-bg.jpg) no-repeat center center;
background-size: cover;
}

/* 通常背景リピート*/
/* div#spg-str-main div#spg div.hdg-l1-01-wrap{
width: 100%;
overflow: hidden;
text-align: center;
background: url(images/hdg-l1-01-bg.jpg) top left repeat-x;
} */

div#spg-str-main div#spg div.hdg-l1-01-inner{
min-width:960px;
height : auto ;
margin: 0 auto;
}

div#spg-str-main div#spg div.hdg-l1-01-inner h1{
position:relative;
left:50%;
margin-left:-100%;
}

/* スマホ用 */
div#spg-str-main div#spg div.hdg-l1-01-inner img {
max-width : 100% ;
height : auto ;
}


/*  bar-wrap
---------------------------------------*/
div#spg-str-main div#spg div.bar-wrap{
width: 100%;
overflow: hidden;
background: url(images/box-content-bar.jpg) top left repeat-x;
}

div#spg-str-main div#spg div.bar-inner{
min-width:960px;
height: 100px;
margin: 0 auto;
}


/*  box-content-wrap//.contents-1000px
---------------------------------------*/
div#spg-str-main div#spg div.box-content-wrap{
width: 100%;
overflow: hidden;
text-align: center;
padding: 20px 0px 40px 0px;
}
div#spg-str-main div#spg div.box-content-wrap.pattern{
background: url(images/box-content-bg-01.jpg) no-repeat top center;
}

div#spg-str-main div#spg div.box-content-wrap p.hdg-number{
margin-bottom: 20px;
}

div#spg-str-main div#spg div.box-content-wrap h2{
margin-bottom: 20px;
}

div#spg-str-main div#spg div.box-content-wrap h3{
font-size: 30px;
background: linear-gradient(transparent 50%, #FFF7B9 50%);
display: inline;
padding: 0 10px;
}

div#spg-str-main div#spg div.box-content-wrap ul{
font-size: 16px;
}
div#spg-str-main div#spg div.box-content-wrap ul li{
margin-bottom: 10px;
}

div#spg-str-main div#spg div.box-content-wrap div.box-explant-01,
div#spg-str-main div#spg div.box-content-wrap div.box-explant-02,
div#spg-str-main div#spg div.box-content-wrap div.box-explant-03{
margin-top: 40px;
position:relative;
}
div#spg-str-main div#spg div.box-content-wrap div.box-explant-01{
min-height: 520px;
}
div#spg-str-main div#spg div.box-content-wrap div.box-explant-02{
min-height: 330px;
}
div#spg-str-main div#spg div.box-content-wrap div.box-explant-03{
min-height: 540px;
}

div#spg-str-main div#spg div.box-content-wrap div.box-explant-01 p.pict01{
position:absolute;
top:28px;
left:18px;
z-index: 10;
}
div#spg-str-main div#spg div.box-content-wrap div.box-explant-01 p.pict02{
position:absolute;
top:75px;
left:445px;
z-index: 20;
}

div#spg-str-main div#spg div.box-content-wrap div.box-explant-02 p.pict03{
position:absolute;
top:140px;
left:127px;
}

div#spg-str-main div#spg div.box-content-wrap div.box-explant-03 p.pict04{
position:absolute;
top:40px;
left:0px;
}


/*  box-tour-wrap//.contents-800px
---------------------------------------*/
div#spg-str-main div#spg div.box-tour-wrap{
width: 100%;
overflow: hidden;
padding: 20px 0px 60px 0px;
background: #59A8CA;
}

div#spg-str-main div#spg div.box-tour-wrap h2{
text-align: center;
margin-bottom: 20px;
}

div#spg-str-main div#spg div.detailBoxWrap{
padding-top: 10px;
margin-right: -80px;
}
div#spg-str-main div#spg div.detailBoxWrap div.detailBox{
width: 380px;
float: left;
margin-right:40px;
}
div#spg-str-main div#spg div.detailBoxWrap div.detailBox p.subtitle{
font-size: 20px;
margin-bottom: 5px;
}
div#spg-str-main div#spg div.detailBoxWrap div.detailBox h3{
font-size: 34px;
font-weight: bold;
text-shadow:0px 0px 12px #fff, 0px 0px 12px #fff, 0px 0px 12px #fff, 0px 0px 12px #fff, 0px 0px 12px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 3px #fff, 0px 0px 3px #fff;
	filter: glow(Color=#ffffff,Strength=10);
}
div#spg-str-main div#spg div.detailBoxWrap div.detailBox p.bnr{
margin-bottom: 15px;
}
div#spg-str-main div#spg div.detailBoxWrap div.detailBox p.intro{
color: #FFF;
padding-bottom: 25px;
}

/* 吹き出し本体 - 左右の中心 */
.fukidashi{
  position: relative;
	width: 360px;
  padding: 15px 10px;
  background-color: #FAF62F;
	text-align: center;
	margin-bottom: 25px;
	border-radius: 10px;
	-webkit-border-radius: 10px;    /* Safari,Google Chrome用 */ 
	-moz-border-radius: 10px;   /* Firefox用 */ 
}
/* 三角アイコン - 左右の中心 */
.fukidashi::before{
  content: '';
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  left: 0;
  right: 0;
  bottom: -15px;
  margin: 0 auto;
  border-top: 15px solid #FAF62F;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}


/* 背景がアニメーションするボタン */
.stripe{
  font-size: 30px;
  letter-spacing: .2em;
  display: inline-block;
  z-index: 1;
  padding: 16px 20px;
  width: 340px;
  overflow: hidden;
  text-align: center;
  background: rgb(245, 98, 0);
  color: #ffffff;
	cursor: pointer;
  position: relative;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow:0px 3px 3px rgba(0,0,0,0.5);  /* Firefox用 */
-webkit-box-shadow:0px 3px 3px rgba(0,0,0,0.5);  /* Google Chrome,Safari用 */
}
.stripe::before{
  z-index: -1;
  content: '';
  width: calc(200% + 40px);
  position: absolute;
  left: calc(-100% - 40px);
  height: 100%;
  display: block;
  top: 0;
  background: linear-gradient(135deg, rgba(242,144,46,1) 55%,rgb(245, 98, 0) 55%);
  transition: .3s;
}
.stripe:hover::after{
  z-index: 1;
  content: '';
  width: 50px;
  height: 50px;
  position: absolute;
  display: block;
  bottom: 0;
  right: 0;
  background: linear-gradient(135deg, rgba(242,144,46,0) 50%,rgb(245, 98, 0) 50%);
}
.stripe:hover::before{
  left: 0;
}
.stripe a{
text-decoration: none;
color: #fff;
}
.stripe:hover{
}


/*  box-relation-wrap
--------------------------------------- */
div#spg-str-main div#spg div.box-relation-wrap{
width: 100%;
overflow: hidden;
text-align: center;
background: url(images/hdg-l1-01-bg.jpg) repeat-y top center;
background-size: cover;
}

div#spg-str-main div#spg div.relationBox {
	background-color: #FFF;
	margin: 60px 0;
	padding: 20px 35px 40px 35px;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow:0px 3px 3px rgba(0,0,0,0.5);  /* Firefox用 */
-webkit-box-shadow:0px 3px 3px rgba(0,0,0,0.5);  /* Google Chrome,Safari用 */
}

div#spg-str-main div#spg div.relationBox ul{
	padding-top: 20px;
	/*margin-right: -80px;*/
}

div#spg-str-main div#spg div.relationBox ul li {
	margin: 10px 10px 0 0 ;
	float:left;
}


/*  fadeAnime // js
--------------------------------------- */
div#spg-str-main div#spg .fadeAnime {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1.5s;
 -ms-animation-duration:1.5s;
 animation-duration:1.5s;
 -webkit-animation-name: fadeAnime;
 -ms-animation-name: fadeAnime;
 animation-name: fadeAnime;
 visibility: visible !important;
}
@-webkit-keyframes fadeAnime {
 0% { opacity: 0; -webkit-transform: translateY(30px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeAnime {
 0% { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}




/* .box-notice-01
---------------------------------------*/
div#spg-str-main div#spg .box-notice-01{
	border: 1px solid #ACACAC;
	padding: 10px;
	background: #FFF;
	font-size: 0.93em;
	margin-top: 20px;
}


/*  box-relation-01
--------------------------------------- */
/* div#spg-str-main div#spg div.box-relation-01 {
	background: #FFFEEC;
	border-right: 1px solid #5B3F1F;
	border-bottom: 1px solid #5B3F1F;
	border-left: 1px solid #5B3F1F;
	padding: 9px 19px 19px;
	margin: 0px;
}

div#spg-str-main div#spg div.box-relation-01 ul{
	margin: 0 -40px 15px 0;
}

div#spg-str-main div#spg div.box-relation-01 ul li {
	margin: 10px 20px 0 0;
	float:left;
} */


/*  footer
--------------------------------------- */
div#spg-str-main div#spg div.box-footnav-01 ul.nav-link-01{
	clear:both;
	text-align:center;
	margin-top: 20px;
}

div#spg-str-main div#spg div.box-footnav-01 ul.nav-link-01 li{
	padding-left:0.8em;
	padding-right:0.8em;
	border-left:1px solid #666;
	display:inline-block;
	*display:inline;
	white-space:nowrap;
}

div#spg-str-main div#spg div.box-footnav-01 ul.nav-link-01 li.first-child{
padding-left:0;
border-left:none;
}


div#spg-str-main div#spg div.box-footnav-01 div.doc-relation-01 {
    margin: 20px 0 0px;
    border: 1px solid #CCC;
    padding-top: 15px;
    padding-right: 20px;
    padding-left: 20px;
}

div#spg-str-main div#spg p.doc-description-01 {
    margin-top: 15px;
    background: #F4F4F4;
    padding: 10px;
    margin-bottom: 10px;
}

div#spg-str-main div#spg .doc-right-01 {
    text-align: right;
}

div#spg-str-main div#spg div.box-footnav-01 div.doc-relation-01 dd {
    padding-bottom: 15px;
}