﻿@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; -webkit-text-size-adjust: 100%;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display: block;}
body{line-height: 1;}
ol, ul{list-style: none;}
blockquote, q{quotes: none;}
blockquote:before, blockquote:after, q:before, q:after{content: ''; content: none;}
table{border-collapse: collapse; border-spacing: 0;}
table th, table td, li{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
/*----- Clearfix ------*/
.clearfix:after{content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix{display: inline-block;}
html .clearfix{height: 1%;}
.clearfix{display: block;}

/*-----------------------------------------------
	Font Size
------------------------------------------------*/
h1 { font-size: 1.6em;}
h2 { font-size: 1.5em;}
h3 { font-size: 1.3em;}
h4 { font-size: 1.2em;}
h5 { font-size: 1em;}
h6 { font-size: 0.83em;}

.fs_SS{font-size: 70%;}/*14px*/
/*1.fs_S{font-size: 80%;}6px*/
.fs_S{font-size: 75%;}/*15px*/

.fs_N{font-size: 100%;}/*default(20px)*/
.fs_L{font-size: 110%;}/*22px*/
.fs_2L{font-size: 120%;}/*24px*/
.fs_3L{font-size: 140%;}/*28px*/
/*3.fs_4L{font-size: 185%;}7px*/
.fs_4L{font-size: 140%;}/*37px*/

.fs_5L{font-size: 200%;}/*40px*/


@media screen and (max-width: 750px){
.fs_SS{font-size: 62.5%;}/*10px*/
.fs_S{font-size: 75%;}/*12px*/
.fs_N{font-size: 81.25%;}/*13px*/
.fs_L{font-size: 81.25%;}/*13px*/
.fs_2L{font-size: 100%;}/*default(16px)*/
.fs_3L{font-size: 112.5%;}/*18px*/
.fs_4L{font-size: 125%;}/*20px*/
.fs_5L{font-size: 137.5%;}/*22px*/
}

@media screen and (max-width: 360px){
.fs_SS{font-size:56.25%;}/*9px*/
.fs_S{font-size: 68.75%;}/*11px*/
.fs_4L{font-size: 118.75%;}/*20px*/
}
/*-----------------------------------------------
	Font Color
------------------------------------------------*/
.fc_white{color: #fff;}
.fc_black{color: #040000;}
.fc_red{color: #f00000;}
.fc_cpw{color: #ccc;}

.on_cl{ color:#767061;}
/*-----------------------------------------------
	Font Link Color
------------------------------------------------*/
a{text-decoration: none; color: #fff;}

a:hover{filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}
.copyright{filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    }
@media screen and (max-width: 750px){
a:hover{filter:alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
}
}
/*-----------------------------------------------
	block, hidden
------------------------------------------------*/
.hidden{display: none;}
.block{display: block;}



/*-----------------------------------------------
	Text Position
------------------------------------------------*/
.t_center{text-align: center;}
.t_left{text-align: left;}
.t_right{text-align: right;}
.t_top{vertical-align: top;}
.t_mdl{vertical-align: middle;}
.t_btm{vertical-align: bottom;}

/*-----------------------------------------------
	float
------------------------------------------------*/
.f_left{float: left;}
.f_right{float: right;}

.l_hi-15{ line-height: 1.5;}
.letSp-01{ letter-spacing: 0.1em}
/*-----------------------------------------------
	margin
------------------------------------------------*/
/*left*/
.ml02{margin-left: .2em;}
.ml03{margin-left: .3em;}
.ml04{margin-left: .4em;}
.ml05{margin-left: .5em;}
.ml06{margin-left: .6em;}
.ml07{margin-left: .7em;}
.ml08{margin-left: .8em;}
.ml09{margin-left: .9em;}
.ml10{margin-left: 1em;}
.ml15{margin-left: 1.5em;}
.ml20{margin-left: 2em;}
.ml25{margin-left: 2.5em;}
.ml30{margin-left: 3em;}
.ml35{margin-left: 3.5em;}
.ml40{margin-left: 4em;}
.ml45{margin-left: 4.5em;}
.ml50{margin-left: 5em;}
.ml55{margin-left: 5.5em;}
.ml60{margin-left: 6em;}
.ml65{margin-left: 6.5em;}
.ml70{margin-left: 7em;}
.ml75{margin-left: 7.5em;}
.ml80{margin-left: 8em;}
.ml85{margin-left: 8.5em;}
.ml90{margin-left: 9em;}
.ml95{margin-left: 9.5em;}
.ml100{margin-left: 10em;}

/*right*/
.mr02{margin-right: .2em;}
.mr03{margin-right: .3em;}
.mr04{margin-right: .4em;}
.mr05{margin-right: .5em;}
.mr06{margin-right: .6em;}
.mr07{margin-right: .7em;}
.mr08{margin-right: .8em;}
.mr09{margin-right: .9em;}
.mr10{margin-right: 1em;}
.mr20{margin-right: 2em;}
.mr30{margin-right: 3em;}
.mr40{margin-right: 4em;}
.mr50{margin-right: 5em;}
.mr60{margin-right: 6em;}
.mr70{margin-right: 7em;}
.mr80{margin-right: 8em;}
.mr90{margin-right: 9em;}
.mr100{margin-right: 10em;}

/*top*/
.mt02{margin-top: .2em;}
.mt03{margin-top: .3em;}
.mt04{margin-top: .4em;}
.mt05{margin-top: .5em;}
.mt06{margin-top: .6em;}
.mt07{margin-top: .7em;}
.mt08{margin-top: .8em;}
.mt09{margin-top: .9em;}
.mt10{margin-top: 1em;}
.mt11{margin-top: 1.1em;}
.mt12{margin-top: 1.2em;}
.mt13{margin-top: 1.3em;}
.mt14{margin-top: 1.4em;}
.mt15{margin-top: 1.5em;}
.mt16{margin-top: 1.6em;}
.mt17{margin-top: 1.7em;}
.mt18{margin-top: 1.8em;}
.mt19{margin-top: 1.9em;}
.mt20{margin-top: 2em;}
/*bottom*/
.mb02{margin-bottom: .2em;}
.mb03{margin-bottom: .3em;}
.mb04{margin-bottom: .4em;}
.mb05{margin-bottom: .5em;}
.mb06{margin-bottom: .6em;}
.mb07{margin-bottom: .7em;}
.mb08{margin-bottom: .8em;}
.mb09{margin-bottom: .9em;}
.mb10{margin-bottom: 1em;}
.mb11{margin-bottom: 1.1em;}
.mb12{margin-bottom: 1.2em;}
.mb13{margin-bottom: 1.3em;}
.mb14{margin-bottom: 1.4em;}
.mb15{margin-bottom: 1.5em;}
.mb16{margin-bottom: 1.6em;}
.mb17{margin-bottom: 1.7em;}
.mb18{margin-bottom: 1.8em;}
.mb19{margin-bottom: 1.9em;}
.mb20{margin-bottom: 2em;}

/*-----------------------------------------------
	padding
------------------------------------------------*/
/*top*/
.pt02{padding-top: .2em;}
.pt03{padding-top: .3em;}
.pt04{padding-top: .4em;}
.pt05{padding-top: .5em;}
.pt06{padding-top: .6em;}
.pt07{padding-top: .7em;}
.pt08{padding-top: .8em;}
.pt09{padding-top: .9em;}
.pt10{padding-top: 1em;}
.pt11{padding-top: 1.1em;}
.pt12{padding-top: 1.2em;}
.pt13{padding-top: 1.3em;}
.pt14{padding-top: 1.4em;}
.pt15{padding-top: 1.5em;}
.pt16{padding-top: 1.6em;}
.pt17{padding-top: 1.7em;}
.pt18{padding-top: 1.8em;}
.pt19{padding-top: 1.9em;}
.pt20{padding-top: 2em;}
/*bottom*/
.pb02{padding-bottom: .2em;}
.pb03{padding-bottom: .3em;}
.pb04{padding-bottom: .4em;}
.pb05{padding-bottom: .5em;}
.pb06{padding-bottom: .6em;}
.pb07{padding-bottom: .7em;}
.pb08{padding-bottom: .8em;}
.pb09{padding-bottom: .9em;}
.pb10{padding-bottom: 1em;}
.pb11{padding-bottom: 1.1em;}
.pb12{padding-bottom: 1.2em;}
.pb13{padding-bottom: 1.3em;}
.pb14{padding-bottom: 1.4em;}
.pb15{padding-bottom: 1.5em;}
.pb16{padding-bottom: 1.6em;}
.pb17{padding-bottom: 1.7em;}
.pb18{padding-bottom: 1.8em;}
.pb19{padding-bottom: 1.9em;}
.pb20{padding-bottom: 2em;}



/*-----------------------------------------------
	Layout (PC)
------------------------------------------------*/
body{ font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", HiraMinProN-W3, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; width: 100%; color: #040000; font-size: 20px; line-height: 2; }


body{ font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", HiraKakuProN-W3, "メイリオ", Meiryo, sans-serif;}


html,body{ height: 100%; width: 100%; overflow: hidden;}




body{ background: #009d8e; line-height: 1; display: table;}
.font_en{font-family: 'Cambay', sans-serif;}

#all_contearea{height: 100%; display: table-cell; vertical-align: middle; text-align: center; }
footer .sec_box{
position: absolute; bottom:5px; text-align: center; width:100%;}

@media only screen and (orientation:landscape) and (max-width: 750px){
   /* landscapeモード（yoko向き）用 */
html,body{ height:568px; min-height:568px; width: 100%; overflow-y: auto; overflow-x: hidden;display: table;}
#all_contearea{height: 568px; min-height:568px; display: table-cell; vertical-align: middle; text-align: center;}
 footer .sec_box{
position: static; bottom:5px; text-align: center; width:100%;}
}



#container{width: 100%;}


p.logo{ width:100%; margin: 5em auto;}
p.logo img { width:8%; min-width:90px;}


@media screen and (max-width: 750px){
p.logo{width:100%; margin: 4em auto;}
}




#horizon1 {
    position: absolute;
    top: 50%;
    left: 0;
    width: 0;
    height: 1px;
    background: #fff;
}







/**/img.logo1  {
  -webkit-animation-duration: 1s;
  -webkit-animation-delay: 1s;
  animation-duration: 1s;
  animation-delay: 1s;
  

}



.zabari{
  -webkit-animation-duration: 2s;
  -webkit-animation-delay: 3s;
  animation-duration: 2s;
  animation-delay: 3s;
}


.fade1{
display: block; max-width: 400px; margin: 0 auto;
  -webkit-animation-duration: 3s;
  -webkit-animation-delay: 3.5s;
  animation-duration: 3s;
  animation-delay: 3.5s;
}
.fade2{
  -webkit-animation-duration: 3s;
  -webkit-animation-delay: 5.5s;
  animation-duration: 3s;
  animation-delay: 5.5s;
}
.fade3{
  -webkit-animation-duration: 2s;
  -webkit-animation-delay: 4.5s;
  animation-duration: 2s;
  animation-delay: 4.5s;
}
/*
.logo img{
  
  animation: 'shake' 2s ease-out 0s infinite alternate;
}

@keyframes shake {
  from {
    margin-top: 100px;
    animation-timing-function: ease-out;
  }
  25% {
    margin-top: 50px;
    animation-timing-function: ease-in;
  }
  50% {
    margin-top: 100px;
    animation-timing-function: ease-out;
  }
  75% {
    margin-top: 75px;
    animation-timing-function: ease-in;
  }
  to {
    margin-top: 100px;
  }
}
*



    
