@charset "utf-8";
@import url(swiper.css);
@import url(drawerMenu.css);

/**********************************************************************　基本　*******************************************************************************/

html { height:100% }
body { height:100% ; text-align: center ; } 

section,
footer,
header
{ position:relative ; max-width: 1280px; margin: 0 auto ; } 
section { background-color: #ffffff } 
footer { background-color: #ffffff }

#demo-1 { margin: 0 auto ; } 

article { position:relative ; text-align: justify ; text-justify: inter-ideograph; }
img, div, p, figure{ margin: 0;padding: 0 }img { border-style: none;vertical-align: bottom }

.mainte { display: none }
.rela { position: relative }
.fxt { position: fixed }
.abso { position: absolute }
.clear-box { clear: both;float: none;margin: 0;padding: 0; }
.clearfix:after { content: '';display: block;clear: both; }
.clearfix { zoom: 1; /* for IE6/7 */ }

hr {
  height: 10px;
  border: 0;
  box-shadow: 0 10px 10px -10px #bbb inset;
  margin: 30px 0;
}

/**********************************************************************　タイポグラフィー　*************************************************************************/

.txl { text-align: left }
.txj { text-align: justify }
.txc { text-align: center }
.txr { text-align: right }

.ph-copy { width: 95% ;margin-left: 2.5%;margin-top: 2% }
.ph-copy p {  }

/**********************************************************************　フォントサイズ　*************************************************************************/

h2 { font-size: 1.5em;line-height: 1.5em } 
h3 { font-size: 1.2em;line-height: 1.5em }
h4 { font-size: 0.9em;line-height: 1.3em }

.pp p { margin-top: 20px ;  }
.pp h4 { font-size: 0.8em;line-height: 1.5em }

article p { font-size: 0.9em;line-height: 1.8em; }

article ul li { font-size: 0.8em;line-height: 1.6em;list-style: none }

article ul.excep li { font-size: 0.9em;line-height: 1.8em; }

.read { font-size: 1.0em;line-height: 1.6em; }
.copy { font-size: 1.0em;line-height: 1.6em; }
.spec { font-size: 0.8em;line-height: 1.6em; }

.cpcr { font-size: 0.8em;line-height:1.8em }
.cpcr .eng { font-size: 2.0em;line-height: 1.6em;letter-spacing: 0.05em }

.card span.cardh { font-size: 1.0em;line-height: 1.6em; }
.card span.cardt { font-size: 0.8em;line-height: 1.5em; }
.card span.cardc { font-size: 0.7em;line-height: 1.5em; }

.tray { font-size: 0.8em;line-height: 1.6em ; }
.thmbph { font-size: 0.8em;line-height: 1.4em; }

th,td 	{ font-size: 0.9em;line-height: 1.7em; }

/**********************************************************************　デザイン　*******************************************************************************/

.video-wrap { padding-top: 59px ; padding-bottom: 0px }
body#index .video-wrap { padding-top: 0 ; padding-bottom: 0px }

.z1 {z-index:1}.z2 {z-index:2}.z3 {z-index:3}.z10 {z-index:10}.z100 {z-index:100}

/**********************************************************************　背景写真ボックス　************************************************************************/

html,body { height: 100%; }

.main-visual {
/*    height: 400px;*/
    background-size: cover;
    text-align: center;
    position: relative;
    overflow: hidden;
}
 
.main-visual img {
    z-index: 2;
    position: absolute;
    top: 100px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}
 
.main-visual video {
    margin: 0 auto;
    z-index: 1;
    width: 100%;
}

#photos.fxt { z-index: 0 }

/***********************************************************************　固定ヘッダー　******************************************************************************/

/***********************************************************************　ロゴ類　******************************************************************************/

.logol { position: relative; max-width: 1280px ; margin: 0 auto }
.logol p { position: absolute ; z-index: 3 }
.logol img { width: 100% ; height: auto ; padding-bottom: 10px }

.logof { margin: 30px 0 10px 0; }

/***********************************************************　ナビゲーションは「wide.css」に記述　****************************************************************/

/***********************************************************************　フッター　******************************************************************************/

footer{
display: block;
clear: both;
float: none;
text-align: center;
position: relative;
padding: 0 0 50px 0;
}


.gakkailink { background-color: hsla(0,0%,100%,1.00);font-size: 0.8em ; box-shadow: 0 10px 10px -10px #bbb inset; padding:50px }
.gakkailink a { box-sizing: border-box; display: block ;color:#000 ; border: #ccc 1px solid; padding: 4px 0; text-align: center; margin :5px; border-radius: 3px ; }

.gakkailink.toppage1 {  }
.meiwaku { background-color: hsla(0,0%,100%,1.00); font-size: 0.9em; ; padding: 30px 50px 20px; box-shadow: 0 10px 10px -10px #bbb inset;  }
.meiwaku a { display: inline-block; border-bottom: dotted 1px #777; margin: 0 5px 10px }

/***********************************************************************　写真　スライドショー　スワイパー　******************************************************************************/

.swiper-wrapper { position: relative; }
.swiper-slide img { width: 100%;height: auto; padding: 5px 0 }
.swiper-slide { width: 100%; }
.swiper-slide { font-size: 18px; font-size: 1.0em }  /*変更可能background: #fff;*/
.swiper-container { width: 100%;margin: 0;overflow: hidden;position: relative; }
.swiper-pagination-bullet { width: 10px;height: 10px; }

.swiper-slide {
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
.swiper-slide {
		-webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
}

#nobg { width: 100%;position: relative;background-repeat: no-repeat;}

.xxxx { width: 100%;padding-bottom: 0px}

/*******************************************************************************　マルチ　*********************************************************************************/

.sing {  width: 100%; }
.lft, .rgt { position: relative; }

.kakomiaka {font-weight:bold;  color: #FB4040; text-align: center; padding: 10px ;margin: 15px 50px 25px 50px ; border:3px solid #FB4040 }

/******************************************************************************* 価格 *********************************************************************************/

 div.set{margin: 0 auto;width: 180px;height: 25px;}
 div.set p{display: block;float: left;width: 60px;}
 div.set p.hin{font-size: 1.0em;line-height: 1.7em;text-align: left;}
 div.set p.price{font-size: 1.5em;line-height: 1.0em;text-align: right;}
span.price{font-size: 1.5em;line-height: 1.0em;}
 div.set p.zei{font-size: 0.9em;line-height: 1.8em;text-align: left;}

/**********************************************************************  カード  *******************************************************************************/

.card { display: block;height: auto;float: left; }
.card a { display: block }
.card a img { width: 100%;height: auto;padding-bottom: 10px}
.card span { display: block; }
/*.card a:hover {opacity: 1 }*/
.card span.cardh { padding-bottom: 3px;margin-bottom: 5px }
.card p.txj { font-size: 0.8em ; line-height: 1.5em ; min-height: 40px  }
.card strong { font-size: 0.9em ; line-height: 1.5em }

a.card-link { background-color: #fff ; padding: 10px 10px ;display: block;margin: 0 } /*border: 1px solid rgba(94,109,166,0.5) ; border-radius: 6px ;*/
a.card-link span.eng { font-size: 0.9em;line-height: 1.4em }  a.card-link span.jp { font-size: 0.8em;line-height: 1.4em }
a.card-link span { display: block }



/**********************************************************************  説明一覧  *******************************************************************************/

.tray .pd { padding: 15px; }
.pp p ,
.pp ul { padding: 0 0 10px 0 ; font-size: 0.8em }

/**********************************************************************  サムネール  *******************************************************************************/

.thmbph { float: left; }
.thmbph img { width: 100%;}

/************************************** ４列セット  *****************************************/
/*
.card a {padding: 10px 0}
.card a img {width: 90%;height: auto;}
*/
/************************************** ６列セット  *****************************************/

.card.card06 a {padding: 10px 0 2%}
.card.card06 a img {width: 86%;height: auto;}

/**********************************************************************　テーブル　*******************************************************************************/

table	{ width: 100%; }
th	{ text-align: left;font-weight: normal; }
.busnav { font-size: .8em; }
.busnav a { padding: 0 3px; color: #4458a4; }
table.bustime { border-top: 1px solid #aaa; border-left: 1px solid #aaa; }
table.bustime th { text-align: center; border-bottom: 1px solid #aaa; border-right: 1px solid #aaa; }
table.bustime td { text-align: center; border-bottom: 1px solid #aaa; border-right: 1px solid #aaa; }
table.bustime th.okg  { width: 17%; background-color: #D0D8F4 }
table.bustime td.okg  { width: 17%; background-color: #E8EDFF }
table.bustime th.busc { width: 17%; background-color: #F4E8D0 }
table.bustime td.busc { width: 17%; background-color: #FAF6EC }
table.bustime th.iist { width: 17%; background-color: #D0F4E0 }
table.bustime td.iist { width: 17%; background-color: #EDFDF4 }

/**********************************************************************　フォーム類　*******************************************************************************/

dl.toiawase{font-size: 0.75rem;text-align: left}
dl.toiawase dd.submi { text-align: center}
input {margin-right: 5px;margin-bottom: 5px;}
textarea {border: 1px solid #ddd;}

/**********************************************************************　画像サイズの調整　*******************************************************************************/

.phj img { width: 100%; height: auto ; padding-bottom: 10px }

/************************************************animation************************************************/


.fadeInStay {
 -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: fadeInStay;
 animation-name: fadeInStay;
 visibility: visible !important;
}
@-webkit-keyframes fadeInStay {
 0% { opacity: 0; -webkit-transform: translateY(0); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInStay {
 0% { opacity: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.fadeInDown {
 -webkit-animation-fill-mode:both;
 -ms-animation-fill-mode:both;
 animation-fill-mode:both;
 -webkit-animation-duration:1s;
 -ms-animation-duration:1s;
 animation-duration:1s;
 -webkit-animation-name: fadeInDown;
 animation-name: fadeInDown;
 visibility: visible !important;
}
@-webkit-keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); }
}
@keyframes fadeInDown {
 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); }
 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}