@charset "UTF-8";

/*================================================
 *  CSSリセット
 ================================================*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:normal;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*================================================
 *  一般・共通設定
 ================================================*/
body {
    font-size:18px;
    color:#333;
    font-family:"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
    line-height:1.6;
}

#main {
    margin:0 auto;
}

section {
}

a {
    color:#333;
}

a:hover {
    color:#fff;
}

h1 {
    color:#FFF;
    font-size:50px;
    line-height:1.2;
}

h1 a {
    color:#333;
    text-decoration:none;
}
h1 a:hover {
    color:#fff;
    text-decoration:underline;
}

h2 {
    padding-top:1.0em;
    padding-bottom:1.0em;
    font-size:25px;
    color:#333;
    text-align:center;
    background-color:#F9F9F9;
    
}


h3 {
    padding:2px 5px;
    color:#333;
    font-size:20px;
    background-color:#F9F9F9;
    border-bottom: 1px solid #DDD;
   
}

h4 {
    margin-bottom:0.25em;
    padding:2px 5px;
    color:#fff;
    font-size:20px;
}


h5 {
    margin-bottom:0.25em;
    padding:2px;
    color:#333;
    font-size:16px;
    border-top:1px dotted #382400;
    border-bottom:1px dotted #382400;
    background:#b7af9c;
}

h6 {
    margin-bottom:0.25em;
    color:#333;
    font-size:14px;
    font-weight:bold;
}

p {
    margin:1%;
}

img {
    vertical-align:bottom;
    width:100%;
}

em {
    font-weight:bold;
}

strong {
    font-weight:bold;
    color:#7fb6ae;
}

pre {
    margin:1em 0;
    padding:1em;
}

blockquote {
    margin-bottom:1em;
    padding:1em;
    border:1px dotted #ddd;
    border-left:5px solid #ddd;
}

ul,ol,dl {
    margin:0 0 1em 0;
}
ul li {
    list-style:disc;
}
ol li {
    list-style:decimal;
}
li {
    margin-left:2em;
}

dt {
    margin-bottom:0.5em;
}

dd {
    margin-bottom:1em;
}

table {
    width:100%;
    margin-bottom:1em;
    border-collapse:collapse;
    border:1px solid #ddd;
}
th {
    padding:10px;
    text-align:center;
    vertical-align:middle;
    border:1px solid #ddd;
    background:#eebfb9;
}
td {
    padding:10px;
    text-align:left;
    border:1px solid #ddd;
}

figcaption {
    color:#fff;
 	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 30%;
	background: rgba(0,0,0,.6);
}


.clearfix:after {
	content: url(../images/pixel.gif);
	display: block;
	clear: both;
	height: 0;
}
/*================================================
 *  クラス
 ================================================*/
.textL { text-align:left;}
.textR { text-align:right;}
.textC { text-align:center;}
.textWhite { color:#FFF;}
.textBold { font-weight:bold;}
.text35 { font-size:35px;}

.pd-t10p { padding-top:10%}
.pd-b1E { padding-bottom: 1.0em;}

.bd2G{border:2px solid #ddd;}

.list {
    padding:0 0 0 2em;
}

.list li {
    margin:0;
    padding:0;
    list-style:none;
    text-indent:-1.3em;
}
.list li:before {
    content:"\002618\00a0";
    color:#9b2f3d;
}


.temp {
    clear:both;
    overflow:hidden;
    margin-bottom:50px;
}

.img {
    float:left;
    width:300px;
}

.text {
    float:right;
    width:450px;
}

.photo {
    margin:20px 0;
    padding:10px;
    box-shadow:rgba(113, 135, 164, 0.8) 0 3px 15px 0;
    background:#fff;
}

.catalog {
    overflow:hidden;
    margin-top:8px;
    margin-right:-10px;
}
.catalog li {
    list-style:none;
    float:left;
    margin:0 10px 10px 0;
}
.catalog li img {
    width:95px;
}

.question {
        cursor: pointer;
}
.question:hover {
        text-decoration: underline;
}
.answer {
        display: none;
}


.air {
    padding: 80px 0px;
    box-shadow: 0px 0.25em 0.9em 0px rgba(0, 0, 0, 0.7) inset;

}
.air200 {
    padding: 200px 0px;
    box-shadow: 0px 0.25em 0.9em 0px rgba(0, 0, 0, 0.7) inset;

}

 /*================================================
 *  レイアウト
 ================================================*/
.main {
    margin:0 auto;
    text-align:center;
}

.main940 {
        max-width:940px;
        margin:0 auto;
        font-size:15px;
}

/*================================================
 *  ヘッダー
 ================================================*/
header {
   height:55px;
}
header h1 {
   margin-bottom:20px;
}

/*================================================
 *  グローバルナビゲーション
 ================================================*/
nav {
    padding:0;
    margin:0 auto;
    background:#FFF;
    overflow:hidden;
}
nav ul {
    max-width:940px;
    margin:0 auto;
    padding:0;
}
nav li {
    float:left;
    list-style:none;
    margin:0;
    padding:0;
    width:16.66%;
}
nav li a {
    display:block;
    padding:14px 0;
    color:#909090;
    text-align:center;
    text-decoration:none;
}
nav li:first-child a {
    width:100%;
} 
nav li a:hover {
    color:#000;
    text-decoration:none;
    background:#ddd;
}

.fixed{
  position: fixed;
  top: 0px;
  z-index: 9999;
  width:100%;
}

 /*================================================
 *  トップページ
 ================================================*/
.caption {
        margin:0 auto;
        padding:15%;
        max-width: 940px;
        text-align: center;
        text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.8);
        letter-spacing: 2px;
        display: block;
}

.caption p {
	font-weight:bold;
	font-size:35px;
}

.entrybtn {
   text-align:center;
   padding:30px;
   color:#FFF;
   transition: 0.8s ease-out;
   -webkit-transition: 0.8s ease-out;
   -moz-transition: 0.8s ease-out;
   text-decoration:none;
   display:inline-block;
   font-size:55px;
   
}

.entrybtn:hover {
    color:#333;
    transform:rotateY(360deg);
    -webkit-transform:rotateY(360deg);
    -moz-transform:rotateY(360deg);
}

.main-box {
    width:100%;
    background-color:#F9F9F9;
    padding-bottom:40px;
}

.info-box {
    width:100%;
    background-color:#F9F9F9;
    padding-bottom:40px;
}

.imgbox {
   color:#333;
   float:left;  
   max-height:600px;
   max-width:500px;
   width:31%;
   margin:1%;
   box-shadow:0px 0px 10px;
   -moz-transition: -moz-transform 0.5s linear;
   -webkit-transition: -webkit-transform 0.5s linear;
   -o-transition: -o-transform 0.5s linear;
   -ms-transition: -ms-transform 0.5s linear;
   transition: transform 0.5s linear;
   overflow: hidden;
   position: relative;

}

.imgbox:hover {
   color:#333;
   z-index: 101;

}

.imgbox-innner{
	vertical-align:middle;
}

.info {
    max-width:940px;
    margin:0 auto;
    font-size:15px;
    padding:3%;
}

.info dt {
    border-bottom:none;
    float:left;
    width:150px;
}
.info dd {
    margin: 0px 20px 20px 150px;
    border-bottom:1px solid #ddd;
    text-align:left;
}

.aboutus {
    max-width:940px;
    margin:0 auto;
    font-size:15px;
    padding:3%;
}

/*================================================
 *  フッター
 ================================================*/
footer {
    clear:both;
}

.footmenu {
    width:100%;
    padding:20px 0;
    overflow:hidden;
    border-top:1px dotted #ccc;
    border-bottom:1px dotted #ccc;
}
.footmenu ul {
    position:relative;
    float:left;
    left:50%;
    margin:0;
}
.footmenu li {
    position:relative;
    left:-50%;
    float:left;
    list-style:none;
    padding:0 10px;
    font-size:12px;
    text-align:center;
}

.footer-box {
    width:100%;
    background-color:#F9F9F9;
}

.copyright {
    clear:both;
    padding:20px 0;
    font-size:11px;
    text-align:center;
}

/*================================================
 *  ページトップへの戻り
 ================================================*/
.totop {
    position:fixed;
    bottom:15px;
    right:15px;
}
.totop a {
	opacity: 0.6;
    display:block;
    text-decoration:none;
    background-color: #333;
    width: 45px;
    padding: 3px;
    text-align: center;
    display: block;
}

.totop a:hover {
    border-style: none;
    -moz-opacity:1.0;
    -khtml-opacity: 1.0;
    opacity:1.0;
}

/*================================================
 *  スライドショー
 ================================================*/

.cb-slideshow,
.cb-slideshow:after {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: -100;
}
.cb-slideshow:after {
    content: '';
    background: transparent url(../images/pattern.png) repeat top left;
}

.cb-slideshow li {
    list-style:none;
}

.cb-slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 18s linear infinite 0s;
    -moz-animation: imageAnimation 18s linear infinite 0s;
    -o-animation: imageAnimation 18s linear infinite 0s;
    -ms-animation: imageAnimation 18s linear infinite 0s;
    animation: imageAnimation 18s linear infinite 0s; 
}

.cb-slideshow li div {
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
    color: #fff;
    -webkit-animation: titleAnimation 18s linear infinite 0s;
    -moz-animation: titleAnimation 18s linear infinite 0s;
    -o-animation: titleAnimation 18s linear infinite 0s;
    -ms-animation: titleAnimation 18s linear infinite 0s;
    animation: titleAnimation 18s linear infinite 0s;
}
.cb-slideshow li div h4 {
    font-size: 90px;
    padding: 0;
    line-height: 130px;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.8);

}

.cb-slideshow li:nth-child(1) span {
    background-image: url(../images/back01.jpg);
}
.cb-slideshow li:nth-child(2) span {
    background-image: url(../images/back02.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}

.cb-slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}

.cb-slideshow li:nth-child(3) span {
    background-image: url(../images/back03.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}

.cb-slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}

@keyframes imageAnimation {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        transform: scale(1.05);
        animation-timing-function: ease-out;
 
    }
    17% {
        opacity: 1;
        transform: scale(1.1);
        
    }
    35% {
        opacity: 0;
        transform: scale(1.15); 
    }
    100% {
         opacity: 0;
    }
}

@-webkit-keyframes imageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        -webkit-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -webkit-transform: scale(1.1);
    }
    35% {
        opacity: 0;
        -webkit-transform: scale(1.15); 
    }
    100% {
         opacity: 0;
    }
}

@-moz-keyframes imageAnimation {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -moz-transform: scale(1.05);
        -moz-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -moz-transform: scale(1.1);
    }
    35% {
        opacity: 0;
        -moz-transform: scale(1.15); 
    }
    100% {
         opacity: 0;
    }
}

@-o-keyframes imageAnimation {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -o-transform: scale(1.05);
        -o-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -o-transform: scale(1.1);
    }
    35% {
        opacity: 0;
        -o-transform: scale(1.15); 
    }
    100% {
         opacity: 0;
    }
}

@-ms-keyframes imageAnimation {
    0% {
        opacity: 1;
        -ms-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -ms-transform: scale(1.05);
        -ms-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -ms-transform: scale(1.1);
    }
    35% {
        opacity: 0;
        -ms-transform: scale(1.15); 
    }
    100% {
         opacity: 0;
    }
}

@keyframes titleAnimation {
    0% { 
        opacity: 0;
        transform: translateY(-120%);
     }
    8% {
        opacity: 1;
        transform: translateY(0%);
    }
    17% {
       opacity: 1;
       transform: translateY(0%);
    }
    19% {
       opacity: 0;
       transform: translateY(100%);
    }
    100% {
       opacity: 0;
    }
}    
.no-cssanimations .cb-slideshow li span{
    opacity: 1;
}
/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:779px) {
    body {
    	box-sizing:border-box;
     }
     
/*================================================
 *  一般・共通設定
 ================================================*/
    #main {
        float:left;
        width:100%;
    }
        
    h1 {
    	font-size:40px;
    }
    
	figcaption {
		bottom: 0%;
	}

/*================================================
 *  ヘッダー
 ================================================*/
	header ul {
	    position: fixed; 
	    right:0;
	    top: -552px;
	    width:100%;
	    padding:0;
	    -webkit-transition:.5s ease-in-out;
	    -moz-transition:.5s ease-in-out;
	    transition:.5s ease-in-out;
	    text-align:left;
	    background-color:#fff;
	    z-index:15;
	}
	
	header ul li {
	    display:block;
	    margin:0;
	    border-bottom:dotted 1px #333;
	    line-height:2.5;
	    width:100%;
	}
	header ul li a {
	    display:block;
	    color:#333;
	}
	
	header ul li a:hover {
	    color:#fff;
	    background-color:#333;
	}
	
	header ul li::after {
	    content:'';
	}
	header ul li:last-child {
	    border-bottom:none;
	}
    
/*================================================
 *  グローバルナビゲーション
 ================================================*/
	.navToggle {
	    display:block;
	    position:fixed;
	    right:13px;
	    top:13px;
	    width:30px;
	    height:25px;
	    cursor:pointer;
	    z-index:100;
	    padding-left: 10px;
	    padding-bottom: 10px;
	}
	
	.navToggle div {position:relative;
	}
	
	.navToggle span {
	    display:block;
	    position:absolute;
	    width:100%;
	    border-bottom:solid 3px #999;
	    -webkit-transition: .35s ease-in-out;
	    -moz-transition: .35s ease-in-out;
	    transition: .35s ease-in-out;
	}
	
	.navToggle span:nth-child(1) {
	    top:0;
	}
	
	.navToggle span:nth-child(2) {
	    top:11px;
	}
	
	.navToggle span:nth-child(3) {
	    top:22px;
	}
	.openNav .navToggle span:nth-child(1) {
	    top: 11px;
	    -webkit-transform:rotate(-45deg);
	    -moz-transform:rotate(-45deg);
	    transform:rotate(-45deg);
	}
	.openNav .navToggle span:nth-child(2) {
	    top: 11px;
	    -webkit-transform:rotate(45deg);
	    -moz-transform:rotate(45deg);
	    transform:rotate(45deg);
	}
	.openNav .navToggle span:nth-child(3) {
	    top: 11px;
	    -webkit-transform:rotate(45deg);
	    -moz-transform:rotate(45deg);
	    transform:rotate(45deg);
	}
	
	.openNav ul {
	    -moz-transform: translateY(552px);
	    -webkit-transform: translateY(552px);
	    transform: translateY(552px)
	
	}

 /*================================================
 *  トップページ
 ================================================*/
    .main {
		margin-top:0;
		padding-top:0;
	}
	
	.caption p {
		font-size:25px;
	}

	.imgbox {
    	float:none;
    	width:60%;
    	margin:0 auto;
    	margin-bottom:5%;
	}
   
	.info dt {
	    border-bottom:none;
		float:left;
		width:100px;
	}
	.info dd {
		margin: 0px 10px 10px 100px;
	    border-bottom:1px solid #ddd;
	    text-align:left;
	}
	
 /*================================================
 *  ページトップへの戻り
 ================================================*/
    .totop {}
	
/*================================================
 *  スライドショー
 ================================================*/
	.cb-slideshow li:nth-child(1) span {
		background-image: url(../images/back01-600.jpg);
	}
	.cb-slideshow li:nth-child(2) span {
		background-image: url(../images/back02-600.jpg);
	}
	.cb-slideshow li:nth-child(3) span {
		background-image: url(../images/back03-600.jpg);
	}
	.cb-slideshow li:nth-child(4) span {
		background-image: url(../images/back04-600.jpg);
	}
	.cb-slideshow li:nth-child(5) span {
		background-image: url(../images/back05-600.jpg);
	}
	.cb-slideshow li:nth-child(6) span {
		background-image: url(../images/back06-600.jpg);
	}
	.cb-slideshow li div h4 {
		font-size: 40px;
		line-height: 70px;
	}