@charset "UTF-8";
/* Reset Stylesheet Based on - html5doctor.com Reset Stylesheet http://html5doctor.com/html-5-reset-stylesheet/ */
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, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
table { border-collapse: collapse; border-spacing: 0; }
input, select { vertical-align: middle; }
ul, li { list-style: none; }

/*-------------------------------------
clearfix
-------------------------------------*/
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/*-------------------------------------
basic
-------------------------------------*/

@media screen and (min-width: 768px) {
	body { font-family: sans-serif, Arial, Helvetica, Verdana, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック"; line-height: 1.8; -webkit-text-size-adjust: 100%; 
		width: 80%;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 767px) {
	body { font-family: sans-serif, Arial, Helvetica, Verdana, "ヒラギノ角ゴPro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック"; line-height: 1.8; -webkit-text-size-adjust: 100%;}
}

a { text-decoration: none; cursor: pointer; color: rgb(0,100,210); }
a:hover { text-decoration: underline; }
h1 { font-size: 120px; font-family: "Oswald"; font-weight: 500; line-height: 1.2; }
h2 { font-size: 70px; font-family: "Oswald"; font-weight: 500; line-height: 1.2; }
h3 { font-size: 24px; }
p, ul, dl, table, input, select, address, span { font-size: 16px; line-height: 2; font-style: normal; }
img { vertical-align: bottom; }

/*-------------------------------------
header
-------------------------------------*/
header { position: absolute; top: 0px; left: 0px; z-index: 2; }
header .logo { width: 230px; height: 130px; background: rgb(255,255,255); font-size: 0; }
header .logo a { width: 170px; height: 30px; padding: 10px 30px; display: block; }
header img { height: 110px;}
header .menu { position: relative; }
header .menu a { width: 230px; height: 100px; display: block; background: rgb(0,0,0); }
header .menu a:hover { background: rgb(255,255,255); }
header .menu .menu-icon { display: block; position: absolute; top: 50%; left: 50%; width: 42px; height: 6px; margin: -3px 0 0 -21px; background: rgb(255,255,255); transition: .2s; }
header .menu .menu-icon:before { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 42px; height: 6px; margin-top: -18px; margin-left: -21px; background: rgb(255,255,255); transition: .3s; }
header .menu .menu-icon:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 42px; height: 6px; margin-top: 12px; margin-left: -21px; background: rgb(255,255,255); transition: .3s; }
header .menu a:hover .menu-icon { background: rgb(0,0,0); }
header .menu a:hover .menu-icon:before { background: rgb(0,0,0); }
header .menu a:hover .menu-icon:after { background: rgb(0,0,0); }
header .menu .close { background: transparent; }
header .menu .close:before { margin-top: 0; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
header .menu .close:after { margin-top: 0; transform: rotate(-135deg); -webkit-transform: rotate(-135deg); }
header .menu a:hover .close { background: none; }

header .menu-list { display: none; }
header .menu-list li { margin-top: 1px; text-align: center; background: rgb(0,0,0); font-family: "Oswald"; font-weight: 500; }
header .menu-list li a { width: 230px; padding: 15px 0px; display: block; color: rgb(255,255,255); position: relative; z-index: 2; overflow: hidden; transition: .2s; }
header .menu-list li a:before { position: absolute; z-index: -1; display: block; content: ''; transition: .2s; }
header .menu-list li a:after { position: absolute; z-index: -1; display: block; content: ''; transition: .2s; top: 0%; left: -100%; width: 100%; height: 100%; }
header .menu-list li a:hover { color: rgb(0,0,0); text-decoration: none; }
header .menu-list li a:hover:after { top: 0; left: 0; background: rgb(255,255,255); }

/*-------------------------------------
contents
-------------------------------------*/
#contents { text-align: center; overflow: hidden; }

/*-------------------------------------
footer
-------------------------------------*/
footer { width: 90%; padding: 5%; font-family: "Oswald"; font-weight: 500; color: rgb(0,0,0); background: rgb(255,255,255); overflow: hidden; }
footer address { float: left; margin-right: 100px; }
footer address a { color: rgb(255,255,255); }
footer ul { float: left; border-left: 2px solid rgb(255,255,255); margin: 20px 0px; }
footer li { margin-left: 20px; }
footer li a { color: rgb(255,255,255); }
footer p { float: right; }