﻿@charset "utf-8";
/* -------------------------------- CSSInfo
Project: apparatus2
Author: y_enoto
Style : commonStyleFile for responsible design
------------------------------------------*/

@media screen and ( max-width:1120px ) {

html,body {font-size: 12px; overflow-x: hidden;}

/* Main Menu
*******************************************/
#main-menu {position: absolute; border: none;}

/* menu toggle icon */
#toggle_menu {display: block; top: 5px; left: 5px; height: 32px; width: 35px;}
#toggle_menu span {position: absolute; left: 0; width: 100%; height: 4px; background-color: #000000; border-radius: 4px;}
#toggle_menu span:nth-of-type(1) {top: 0;}
#toggle_menu span:nth-of-type(2) {top: 15px;}
#toggle_menu span:nth-of-type(3) {bottom: 0;}

/* dropdown */
nav {top: 30px;}
#nav {position: relative;}
#nav li {float: none; background-color: #FFF; border-bottom: 1px solid #ccc;}
#nav {display: none;}
#nav .dp {left: 108px; top: -4px;}
#nav .dp li:nth-child(1):before {  border-color: transparent #fb9d23 transparent transparent; border-image: none; border-style: solid; border-width: 10px; content: ""; display: inline-block; left: -20px; position: absolute; top: 50%; }

/* Layout
*******************************************/
#top {width: 100%;}

/* BackTopLink
*******************************************/
#ptop { bottom: 50px; right: 2%; }
#ptop a { padding: 10px; }

/* input Size for sp
*******************************************/
.sp_select_fit{width:calc(100% - 4px);}
.sp_text_fit{width:calc(100% - 6px);}

/* CommonUtility
*******************************************/
.sp_show{display: inherit;}
.sp_hide{display: none;}

}



@media screen and ( max-width:768px ) {
/* Header
*******************************************/
header{width: 100%;}
#logo img {height: 40px;}
#titleArea{line-height: 40px;}
#userArea{line-height: 35px;}

/* Content
*******************************************/
#content {}

/* Footer
*******************************************/
footer{}

/* Heading
*******************************************/
h1 { font-size: 18px; line-height: 28px; height: 28px;}
h2 { font-size: 16px; line-height: 21px; height: 21px;}

/* Section:login
*******************************************/
#login form { }
#login dl { }
#login dt { }

/* Button Size
*************************************************/
input[type='button'], input[type='submit'] { height: 24px;}
input[type='button'].sp_auto, input[type='submit'].sp_auto { width: auto;}

/* table layout for sp
*******************************************/
div.scroll_table {overflow-x: scroll; -webkit-overflow-scrolling: touch;}
div.scroll_table table{ width: 1020px;}

table.vertical_table colgroup{ width: auto !important; }
table.vertical_table td, table.vertical_table th { display: block; }
table.vertical_table th:not(:first-child),table.vertical_table td:not(:first-child) { border-left: none; }
table.vertical_table tr th { border-top: 1px dotted #999; }
table.vertical_table tr:not(:first-child) td, table.vertical_table tr:first-child th:first-child { border-top: none; height: auto;}

table.head_data_table colgroup{ width: auto !important; }
table.head_data_table th, table.head_data_table td {display: inline-block; height: auto; vertical-align: top;}
table.head_data_table th{width: 30%; border-left: none;}
table.head_data_table td{width: 70%; border-left: 1px dotted #999;}
table.head_data_table tr:first-child th, table.head_data_table tr td {border-top: 1px dotted #999; }
table.head_data_table tr:first-child th:first-child, table.head_data_table tr:first-child td:nth-child(2) {border-top: none; }
table.head_data_table { background-color: #B6CAEE;}
table.head_data_table td { background-color: #fff;}

/* 個別
*******************************************/

}
