﻿/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, address, cite, em, img, dl, dt, dd, ol, ul, li, fieldset, form, label, table, caption, tbody, tfoot, thead, tr, th, td, select, input, textarea, button {margin:0; padding:0; border:0; font-size:15px; font-family:HelveticaNeue-Light,AppleSDGothicNeo-Light,sans-serif;}
body{line-height:1.3;}
ol, ul{list-style:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content: ''; content:none;}
select, input, textarea, button{resize:none; vertical-align:middle;}
table{border-collapse:collapse;}

input{outline: 0;}
/* basic-alink */
a:link{color:#555;text-decoration:none;}
a:visited{color:#555;text-decoration:none;}
a:active{color:#555;text-decoration:none; background:none; outline:none;}
a:hover{color:#555;text-decoration:none;}

/* form basic */
input[type=text],
input[type=password]{margin:0; padding:15px 10px; width:100%; border:1px solid #ccc; box-sizing:border-box; -webkit-box-sizing:border-box; color:#333; vertical-align:middle; font-size:15px; background-color:#fff;}
select{padding:9px 7px; width:100%; border:1px solid #ddd; box-sizing:border-box; -webkit-box-sizing:border-box; color:#555; background-color:#fff; -webkit-appearance:none; background-image:url(../img/icon_set.png); background-repeat:no-repeat; background-size:96px 250px; background-position:right -72px;}
input[type=checkbox]{padding:0; width:24px; height:24px; border:1px solid #ddd; -webkit-appearance:none; background-image:url(../img/icon_set.png); background-size:96px 250px; background-position:-49px -1px; box-sizing:border-box; -webkit-box-sizing:border-box; cursor:pointer;}
input[type=checkbox]:checked{background-position:-72px 0 !important; border:0;}
input[type=text],
input[type=password],
select{border-radius:3px;}
input[type=radio]{padding:0; width:24px; height:24px; border:0; -webkit-appearance: none; background-image:url(../img/icon_set.png); background-size:96px 250px; background-position:-48px -25px; cursor:pointer;}
input[type=radio]:checked{background-position:-72px -25px;}
label{cursor:pointer;}

/* button style - basic */
button{overflow:hidden; position:relative; color:#555; border:1px solid #eee; background:#fafafa; border-radius:3px; cursor:pointer; outline:0;}
button span{position:relative; display:inline-block; padding:0 10px; line-height:26px; color:#555; font-weight:400; font-size:14px; white-space:nowrap; text-align:center;}
button.empty{display:none; position:absolute; top:50%; right:10px; margin-top:-12.5px; width:25px; height:25px; border:0; background-color:transparent; background-image:url(../img/icon_set.png); background-size:96px 250px; background-position:-30px -52px;}
button.empty.txtin{display:block;}

/* layout */
body{background-color:#f7f7f7;}
body:before{content:""; position:absolute; top:0; left:0; width:100%; height:5px; background:url(../img/top_line_color.png) no-repeat right top #005dab;}
#wrap{position:absolute; left:0; right:0; top:0; bottom:0;}

/* header */
#header{position:relative; padding-top:5px;}
#header h1{margin-top:30px; text-align:center;}
#header h2{padding:5px 0; color:#645e48; font-size:27px; text-align:center; letter-spacing:-2px;}

/* container */
#container{position:relative; padding:20px 10px;}
.input_row{position:relative; margin-bottom:10px;}
.login_alert{margin-bottom:10px; color:#cf3b2c; font-size:14px;}
.stay{padding:7px 0; border:1px solid transparent;}
.staff{position:absolute; z-index:2; top:0; right:0; padding:7px 10px; border:1px solid transparent;}
.staff.fold{background-color:#eff9ff; border:1px solid #d9ecf7; border-bottom:1px solid #eff9ff;}

ol.tab{display:table; border-collapse:collapse; margin-bottom:15px; width:100%;}
ol.tab>li{display:table-cell; position:relative; width:50%;}
ol.tab>li>b{display:block; padding:15px 10px; width:100%; box-sizing:border-box; text-align:center; border:1px solid #ccc; background-color:#fff; cursor:pointer;}
ol.tab>li:first-child>b{border-right:0;}
ol.tab>li.on>b{background-color:#eff9ff;}
ol.tab>li.on:after{content:''; position:absolute; top:50px; left:1px; right:0; border-bottom:1px solid #eff9ff;}
ol.tab>li>ul.type{display:none; position:relative; margin-left:-100%; padding:15px 10px; width:200%; box-sizing:border-box; border:1px solid #ccc; border-top:0; background-color:#eff9ff;}
ol.tab>li:first-child>ul.type{margin-left:0;}
ol.tab>li.on>ul.type{display:block;}
ul.type.fold{display:block; background-color:#eff9ff; border:1px solid #d9ecf7;}
ul.type>li{display:inline-block; margin-left:15px;}
ul.type>li:first-child{margin-left:0;}

.log{display:block; margin-top:20px; width:100%; background-color:#2cb1ff; border:0;}
.log span{line-height:50px; color:#fff; font-size:20px; font-weight:bold;}
.link{margin-top:10px; padding:20px 0; text-align:center; color:#ccc;}
.link a{padding:0 5px;}
/* footer */
#footer{position:relative; margin:0 10px; padding:20px 0; border-top:1px solid #ddd;}
#footer p{clear:both; padding:15px 0; color:#999; font-family:tahoma; font-size:12px; text-align:center;}

#footer .func_btn{position:relative;}
#footer .func_btn ul{display:table; border-spacing:5px; width:100%;}
#footer .func_btn ul li{display:table-cell; width:33.33%;}
#footer .func_btn a{display:block; padding:8px 5px; border:1px solid #ccc; border-radius:3px; background:#fff; background: -webkit-gradient(linear,0 25%,0 100%,from(#fff),to(#f0f0f0)); text-align:center;}
#footer .company_info{padding:5px;}
#footer .company_info h3{margin-top:10px; text-align:center;}
#footer .company_info h3 span{display:inline-block; color:#888; font-size:14px; font-weight:normal;}
#footer .company_info h3 span:after{content:''; display:inline-block; margin-left:5px; width:15px; height:8px; background:url(../img/icon_set.png) no-repeat; background-size:96px 250px; background-position:-55px -64px;}
#footer .company_info h3.fold span:after{background-position:-55px -55px;}
#footer .company_info dl{margin-top:10px; padding:15px; background-color:#f7f7f7; border-radius:3px;}
#footer .company_info dl.fold{display:none;}
#footer .company_info dl dt{clear:both; float:left; width:100px; color:#aaa; font-size:12px; font-weight:normal;}
#footer .company_info dl dd{overflow:hidden; font-size:12px;}
#footer .terms_info{padding:10px 5px; color:#ccc; font-size:12px; text-align:center;}
#footer .terms_info a{padding:0 5px; font-size:12px;}
#footer p{color:#999; font-size:12px; text-align:center;}

/* landscape mode */
html.landscape .bus_nav dl dd h3{max-width:620px;}


/*************************
 * Screen Size : width 320px *
 *************************/
@media only screen and (max-width:320px){

ul.type>li{margin-left:10px;}
ul.type>li>label{font-size:13px;}

}

@media only screen and (min-width:640px){

#wrap{margin:0 auto; width:500px;}

}
