@charset "UTF-8";
@import "reset5.css";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);

body { color:#111815; line-height: 0;  padding: 0; position: relative; min-height: 100%; overflow-x:hidden; background: #fff; -webkit-text-size-adjust: 100%; font-family: "Helvetica Neue", Helvetica, Arial,'Noto Sans JP', sans-serif,"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Meiryo", "Osaka", "MS Pゴシック", "MS PGothic", sans-serif; }
html {  min-height: 100%; }

* html body { font-family: "Helvetica Neue", Helvetica, Arial,'Noto Sans JP', sans-serif,"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Meiryo", "Osaka", "MS Pゴシック", "MS PGothic", sans-serif;  }
*:first-child+html body { font-family: "Helvetica Neue", Helvetica, Arial, 'Noto Sans JP', sans-serif,"游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "Meiryo", "Osaka", "MS Pゴシック", "MS PGothic", sans-serif; }

* {word-wrap: break-word; }
img { -ms-interpolation-mode: bicubic; }
/* !font-size 12px default setting */
body { line-height: 1; letter-spacing: 0.08em }
*:first-child+html body { font-size:77%;}
* html body { font-size:77%;}

body p{ font-size:13px; line-height: 2; letter-spacing: 0.02em; font-weight: 300 }

h1,h2,h3,h4 { line-height: 0 }

/* !clearfix */
hr { display: none; }

.cfix { zoom:1; }
.cfix:after{
    content:"";
    clear:both;
    display:block;
    height:0;
	font-style:italic
}

/* スクロールバーの有無によるズレ対策 
html {
	overflow-y: scroll;
}*/


img { vertical-align:bottom; }


/* margin-bottom
=========================================*/
.mb0 { margin-bottom:0 !important; }
.mb3 { margin-bottom:3px !important; }
.mb4 { margin-bottom:4px !important; }
.mb5 { margin-bottom:5px !important; }
.mb7 { margin-bottom:7px !important; }
.mb10 { margin-bottom:10px !important; }
.mb12 { margin-bottom:12px !important; }
.mb15 { margin-bottom:15px !important; }
.mb20 { margin-bottom:20px !important; }
.mb25 { margin-bottom:25px !important; }
.mb30 { margin-bottom:30px !important; }
.mb35 { margin-bottom:35px !important; }
.mb40 { margin-bottom:40px !important; }
.mb50 { margin-bottom:50px !important; }
.mb60 { margin-bottom:60px !important; }
.mb80 { margin-bottom:80px !important; }
.mb120 { margin-bottom:120px !important; }



/* margin-top
=========================================*/
.mt0 { margin-top:0 !important; }
.mt3 { margin-top:3px !important; }
.mt4 { margin-top:4px !important; }
.mt5 { margin-top:5px !important; }
.mt7 { margin-top:7px !important; }
.mt10 { margin-top:10px !important; }
.mt12 { margin-top:12px !important; }
.mt15 { margin-top:15px !important; }
.mt20 { margin-top:20px !important; }
.mt25 { margin-top:25px !important; }
.mt30 { margin-top:30px !important; }
.mt35 { margin-top:35px !important; }
.mt40 { margin-top:40px !important; }
.mt50 { margin-top:50px !important; }

.mr5 { margin-right:5px !important; }
.mr10 { margin-right:10px !important; }


/* padding-top
=========================================*/
.pt0 { padding-top:0 !important; }
.pt3 { padding-top:3px !important; }
.pt4 { padding-top:4px !important; }
.pt5 { padding-top:5px !important; }
.pt7 { padding-top:7px !important; }
.pt10 { padding-top:10px !important; }
.pt12 { padding-top:12px !important; }
.pt15 { padding-top:15px !important; }
.pt20 { padding-top:20px !important; }
.pt25 { padding-top:25px !important; }
.pt30 { padding-top:30px !important; }
.pt35 { padding-top:35px !important; }
.pt40 { padding-top:40px !important; }
.pt50 { padding-top:50px !important; }
.pt60 { padding-top:60px !important; }



.tx9 { font-size: 9px }
.tx10 { font-size: 10px }
.tx11 { font-size: 11px }
.tx12 { font-size: 12px }
.tx13 { font-size: 13px }
.tx14 { font-size: 14px }
.tx15 { font-size: 15px }
.tx16 { font-size: 16px }
.tx18 { font-size: 18px }
.tx20 { font-size: 20px }
.tx24 { font-size: 24px }

.fltR { float: right; }
.fltL { float: left; }

.txtR { text-align: right; }
.txtL { text-align: left; }
.txtC { text-align: center; }


/* !Links */
a:link { color: #221815; text-decoration: none; font-weight: 400 }
a:visited { color: #221815; text-decoration: none }
a:hover { color: #666666; text-decoration: underline }
a:active { color: #221815; text-decoration: none }


html {  }
#wrapper { width: 100%; height:auto; text-align: left; }

#header { position: fixed; width: 80%; height: 88px; left: 0; top: 11%; z-index: 1000; overflow: hidden }
#header h1 { position: absolute; left: 40px; top: 0; padding: 20px 120px; background: #fff; z-index: 10 }
#header .logo_l { position: absolute; right: 90px; bottom: -40px; z-index: 1 } 
#header .line { position: absolute; right: 0; top: 0; z-index: 0; height: 0; overflow: hidden } 

#contents { position: fixed; width: 80%; left: 0; top: 28%; z-index: 10; opacity: 0 }
#contents ul { margin-left: 160px }
#contents ul li a { display: block; padding-left: 60px; position: relative }
#contents ul li a .arw { position: absolute; left: 0; top: 0 }
#contents p { position: absolute; right: 90px; top: 0 }

#footer { position: fixed; left: 160px; bottom: 0; opacity: 0 }
#footer p { margin-bottom: 2em; }

#lines { width: 100%; text-align: right; margin-left: 88px; position: relative; z-index: 0 }

#loader { position: fixed; left: 50%; top: 50%; margin: -12px 0 0 -12px }


@media screen and (max-width: 760px) {
	
body { font-size:13px; line-height: 2.0; -webkit-text-size-adjust: none; }
body p { font-size:13px; line-height: 2; letter-spacing: 0.02em }

a {color:#fff; text-decoration:none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-touch-callout:none; }

#header { position: fixed; width: 90%; height: 88px; left: 0; top: 11%; z-index: 11 }
#header h1 { position: absolute; left: 20px; top: 0; padding: 25px 20px; background: #fff; z-index: 10 }
#header h1 img { height: 40px }
#header .logo_l { position: absolute; right: 90px; bottom: -40px; z-index: 1 } 
#header .line { position: absolute; right: 0; top: 0; z-index: 0; height: 0; overflow: hidden } 

#contents { position: fixed; width: 100%; left: 0; top: 28%; z-index: 10; opacity: 0 }
#contents ul { margin-left: 20px }
#contents ul li a { display: block; padding-left: 40px; position: relative }
#contents ul li a .arw { position: absolute; left: 0; top: 0 }
#contents p { position: absolute; right: 40px; top: 80px }
#contents p img { width: 60px }

#footer { position: fixed; left: 40px; bottom: 0; opacity: 0 }
#footer p { margin-bottom: 2em; }
#footer img { width: 160px; height: auto }

#lines { width: 100%; text-align: right; margin-left: 88px; position: relative; z-index: 0 }

#loader { position: fixed; left: 50%; top: 50%; margin: -12px 0 0 -12px }

}

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