* {font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;}

html, body {
 position: relative;
 height: 100%;
}
body {
 background: #eee;
 font-size: 14px;
 color:#000;
 margin: 0;
 padding: 0;
}

a {
 color:#000;
 position: relative;
 display: inline-block;
 text-decoration: none;
}
a::after {
 position: absolute;
 bottom: 3px;
 left: 0;
 content: '';
 width: 100%;
 height: 1px;
 background: #000;
 transform: scale(0, 1);
 transform-origin: left top;
 transition: transform .3s;
}
a:hover::after {
 transform: scale(1, 1);
}

.swiper-container {
 width: 100%;
 height: 100%;
 background: #000;
}
.swiper-slide {
 font-size: 18px;
 color:#fff;
 -webkit-box-sizing: border-box;
 box-sizing: border-box;
 padding: 40px 60px;	  
}
 .parallax-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 130%;
  height: 100%;
  -webkit-background-size: auto 100%;
  background-size: auto 100%;
  background-position: left;	
  background-image:url(../img/top-main.png);
 }

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box {
 width:100%;
 font-size:0.9em;
 line-height: 2;
 color:#000;
 position: absolute;
 top: 43%;
 left: 0%;
}

 .swiper-slide .box .box-in{
  width:100%;
  padding:0 300px;
  display: table;
  table-layout: fixed;
 }
  .swiper-slide .box ul{display: table-cell;
  margin:0 0 20px 0;}
   .swiper-slide .box ul li{}	
   .swiper-slide .box ul li:first-child{
    font-size:1.7em;
    font-weight:bold;
   }

/* h
-----------------------------------------------------*/ 
h1 {
 margin:-2% 0 0 0;
 font-size: 0.7em;
 font-weight:normal;
 color:#fff; 
}
h2 {
 font-size: 3.5em;
 position: absolute;
 top: 7%;
 left: 2%;  
}	
.h2-sub{
 font-size:0.35em;
 font-weight:normal;
}	
h3 {
 margin:0 0 10px 0;
 padding:5px 0;
 font-size:1.5em;
}

/* contact
-----------------------------------------------------*/ 
.contact-btn {
 width: 80%;
 margin: 0px auto;
 text-align: center;
 z-index:0;
}
 .contact-btn div {
  position: fixed;
  right: -20px;
  top: 20px;
  width: 16em;
  height: 10em;
  overflow: hidden;
  transform: rotate(45deg);
  z-index:9999999999999999999999999999999;
 }
  .contact-btn div p {
   padding: 3px;
   background-color: #444444;
   font-family:Quicksand, 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  }
   .contact-btn div p a {
    border-top: 1px dashed white;
    border-bottom: 1px dashed white;
    display: block;
    color: white;
    text-decoration: none;
    padding: 2px 0px;
    font-size:1.3em;
   }

.header-logo {
 font-size: 0.8em;
 font-weight:normal;
 color:#fff;
 position: fixed;
 top: 1%;
 right: 8%;
 color:#fff;  
}
		
/* footer
-----------------------------------------------------*/ 	
footer {
 color:#fff;
 font-size: 0.9em;
 font-weight:normal;
 position: fixed;
 bottom: 1%;
 right: 1%;  
}

/* news
-----------------------------------------------------*/ 
.news{
 font-size:1.7em;
 font-weight:bold;
}
.date{
 padding:2px 5px;
 color:#fff;
 font-size:0.8em;
 background:#000;
 display:inline;
}

/* profile
-----------------------------------------------------*/ 
table.profile{
 width:50%;
 margin:0 auto 20px auto;
 font-size:0.9em;
 line-height:1.5;
 float:left;
}
 table.profile td,table.profile th{
  padding:5px 2px;
  border:10px solid #fff;
  vertical-align:middle;
 }
 table.profile th{
  width:20%;
  color:#fff;
  font-size:0.9em;
  background:#000;
  font-weight:normal;
 }

/* other
-----------------------------------------------------*/ 	
.fs04{ font-size:0.4em;}	
.fs06{ font-size:0.6em;}
.fs07{ font-size:0.7em;}
.fs075{ font-size:0.75em;}
.fs08{ font-size:0.8em;}
.fs09{ font-size:0.9em;}
.fs12{ font-size:1.2em;}
.fs14{ font-size:1.4em;}

.ta-r{text-align: right;}

ul.disc{list-style:disc;}		
ul.decimal{list-style:decimal;}

/*.arrow{
 position: relative;
 display: inline-block;
 padding: 0 0 0 16px;
 color: #000;
 vertical-align: middle;
 text-decoration: none;
 font-size: 15px;
}
.arrow::before,
.arrow::after{
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 margin: auto;
 content: "";
 vertical-align: middle;
}
.arrow::before{
 left: 3px;
 width: 9px;
 height: 1px;
 background: #14a4b2;
 -webkit-transform: rotate(45deg);
 transform: rotate(45deg);
}
.arrow::after{
 left: 4px;
 width: 6px;
 height: 6px;
 border-right: 1px solid #14a4b2;
 border-bottom: 1px solid #14a4b2;
}*/

.arrow {
  position: relative;
  display: inline-block;
  margin-left: 5px;
  padding-left: 15px;
  color: #333;
  text-decoration: none;
}
.arrow:before {
  content: '';
  width: 7px;
  height: 7px;
  border: 0;
  border-top: solid 1px #14a4b2;
  border-right: solid 1px #14a4b2;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -9px;
  transform: rotate(45deg);
}

/*.arrow {
  position: relative;
  display: inline-block;
  padding-left: 20px;
  color: #333;
  text-decoration: none;
}
.arrow:before {
  content: '';
  width: 16px;
  height: 16px;
  background: #14a4b2;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 0px;
  margin-top: -14px;
}
.arrow:after {
  content: '';
  width: 5px;
  height: 5px;
  border: 0;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  position: absolute;
  top: 50%;
  left: 3px;
  margin-top: -9px;
  transform: rotate(45deg);
}*/
	

@media only screen and (max-width: 1500px){	

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box {
 top: %;
 font-size:0.8em;
}
 .swiper-slide .box .box-in{
  padding:0 150px;
 }
 
}


@media only screen and (max-width: 1200px){	

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box .box-in{padding:0 100px;}
	
}	


@media only screen and (max-width: 800px){
	
 .parallax-bg {background-image:url(../img/top-main.png);}

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box {font-size:0.9em;}
 .swiper-slide .box .box-in{padding:0 80px;}
 .swiper-slide .box ul li{ font-size:0.9em;}	
 .swiper-slide .box ul li:first-child{font-size:1.2em;}

/* news
-----------------------------------------------------*/ 
.sentence{font-size:0.9em;}

/* profile
-----------------------------------------------------*/ 
table.profile{
 width:90%;
 margin:0 auto;
 float:none;
}
 table.profile td,table.profile th{
  border:0px;
  border-bottom:10px solid #fff; 
 }
 table.profile td{padding:5px 2px;}

}


@media only screen and (max-width: 600px){	

.sp-none{display:none;}
 
 .parallax-bg {background-image:url(../img/top-main-sp.png);}

/* contact
-----------------------------------------------------*/ 
.contact-btn div {
 right: -14px;
 top: 9px;
 width: 10em;
 height: 7em;
}

.header-logo {left: 2%;}

/* h
-----------------------------------------------------*/ 
h1 {margin:-6% auto 0 15%;
font-size: 0.6em;}
h2 {
 font-size: 2.8em;
 top: 4%;
}
h2 img{width:90%;}	
.h2-sub{
 margin:0 0 0 -13px;
 font-size:0.3em;
}

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box {
 top: 24%;
}
.swiper-slide .box .box-in{
 width:75%;
 margin:0 auto;
 padding:0;
 display:block;
}
.swiper-slide .box ul{display: inline;}




/* footer
-----------------------------------------------------*/ 	
footer {
 font-size:0.8em;
 bottom: 5%;
 right: 1%;  
}

/* news
-----------------------------------------------------*/ 
.news{font-size:1.2em;}

/* profile
-----------------------------------------------------*/ 
table.profile{width:100%;}
table.profile td,table.profile th{border-bottom:8px solid #fff; }
table.profile th{
 width:25%;
 padding:5px 2px; 
}
table.profile td{padding:5px;}

}


@media only screen and (max-width: 400px){	
/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box .box-in{
 width:78%;
}

}



@media only screen and (max-width: 320px){	

 .parallax-bg {background-image:url(../img/top-main-sp.png);}

/* contact
-----------------------------------------------------*/ 
.contact-btn div p a {font-size:1.2em;}

/* h
-----------------------------------------------------*/ 
h1 {
 margin:-6% auto 0 15%;
 font-size:0.5em;
}
h2 {
 font-size: 2.2em;
 top: 5%;
}

/* swiper-slide .box
-----------------------------------------------------*/ 
.swiper-slide .box {
 top: 21%;
 line-height:;
}

/* news
-----------------------------------------------------*/ 
.news{ margin: 20px 0 0px 0;}

/* profile
-----------------------------------------------------*/ 
table.profile td,table.profile th{border-bottom:5px solid #fff; }
table.profile th{
 width:30%;
 padding:2px; 
}
table.profile td{padding:2px 4px;}

/* other
-----------------------------------------------------*/ 
.ls-320 {letter-spacing:-2px;}

}