@charset "utf-8";
/* CSS Document : "アズシステム株式会社" common style */

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;background:transparent;}body{line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}ins{background-color:#ff9;color:#000;text-decoration:none;}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}del{text-decoration:line-through;}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}input,select{vertical-align:middle;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
img { vertical-align: bottom; max-width: 100%; height: auto;}
html, body {width: 100%;}
body a:link,
body a:visited { color: #333; text-decoration: underline;}
body a:hover,
body a:active { color: #333; text-decoration: none;}

/* border-box ================================================== */
.main *,
#info,
#info *,
#footer {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}
.main .cb,
.main .cb * {
-webkit-box-sizing:;
-moz-box-sizing: content-box;
-ms-box-sizing: content-box;
-o-box-sizing: content-box;
box-sizing: content-box;
}

/* clear ====================================================== */
.inner:before,
.inner:after,
.section:before,
.section:after,
.main:before,
.main:after,
#header:before,
#header:after,
.cf:before,
.cf:after {
content:"";
display:table;
}
.inner:after,
.section:after,
.main:after,
#header:after,
.cf:after {
clear:both;
}

/* ---------------------------------------------------------------
   d888888o.   8 888888888o       
 .`8888:' `88. 8 8888    `88.     
 8.`8888.   Y8 8 8888     `88     
 `8.`8888.     8 8888     ,88     
  `8.`8888.    8 8888.   ,88'     
   `8.`8888.   8 888888888P'      
    `8.`8888.  8 8888             
8b   `8.`8888. 8 8888             
`8b.  ;8.`8888 8 8888             
 `Y8888P ,88P' 8 8888             
--------------------------------------------------------------- */
body {
position: relative;
color: #333333;
font-size: 13px;
font-family: -apple-system, 'Helvetica Neue', 'Hiragino Kaku Gothic ProN', 'メイリオ', meiryo, sans-serif;
text-align: left;
letter-spacing: 0;
-webkit-text-size-adjust: 100%;
padding-top: 100px;
}
/* header ===================================================== */
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100px;
background: #F2F2F2;
z-index: 2000;
/*
transform: translate3d(0, 0, 0);
*/
}
#header h1 {
text-align: center;
padding-top: 22px;
}
#header #nav {
position: fixed;
top: 100px;
width: 100%;
height: 0;
background: #F2F2F2;
z-index: 3000;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
transition: .5s ease-in-out;
overflow: hidden;
}
#header #nav li {
width: 82%;
border-bottom: #DDD 1px solid;
margin: 0 auto;
opacity: 0;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}
#header #nav li li {
width: 100%;
border-top: #DDD 1px solid;
border-bottom: none;
padding: 0;
}
#header #nav li:first-child {
border-top: #DDD 1px solid;
}
#header #nav li a {
display: block;
padding: 15px 0 14px;
margin: 0 12px;
}
#header #nav li li a {
margin-left: 24px;
}
#header #nav li a:link,
#header #nav li a:visited {
text-decoration: none;
}
#header #nav.open {
height: 100%;
}
#header #nav.open li {
opacity: 1;
}
#navToggle,
#navToggle span {
display: inline-block;
transition: all .4s;
box-sizing: border-box;
}
#navToggle {
position: absolute;
top: 40px;
right: 26px;
width: 24px;
height: 19px;
}
#navToggle span {
position: absolute;
left: 0;
width: 100%;
height: 3px;
background-color: #999;
}
#navToggle span:nth-of-type(1) {
top: 0;
}
#navToggle span:nth-of-type(2) {
top: 8px;
}
#navToggle span:nth-of-type(3) {
bottom: 0;
}
#navToggle.active span:nth-of-type(1) {
-webkit-transform: translateY(8px) rotate(-135deg);
transform: translateY(8px) rotate(-135deg);
}
#navToggle.active span:nth-of-type(2) {
opacity: 0;
}
#navToggle.active span:nth-of-type(3) {
-webkit-transform: translateY(-8px) rotate(135deg);
transform: translateY(-8px) rotate(135deg);
}
#info {
background: #EAEAEA;
line-height: 1.7;
padding: 18px 10px 12px 20px;
margin-bottom: 20px;
}
#info dt {
font-weight: bold;
margin-bottom: 7px;
}
#info dd span.atn {
font-size: 11px;
margin-left: 10px;
}

#header #nav li.bbtcs_banner {
    margin-top: 30px;
    text-align: center;
    border-bottom: none;
}
#header #nav li.bbtcs_banner a {
    padding: 0;
    margin: 0;
}
#header #nav li.bbtcs_banner a:hover { opacity: 0.7;}
#header #nav li.bbtcs_banner:hover::after { content: none !important;}
#header #nav li.bbtcs_banner img.sp { display: none;}

@media screen and (max-width: 959px) {
    #header #nav li.bbtcs_banner img.pc { display: none !important;}        
    #header #nav li.bbtcs_banner img.sp {
        display: block !important;
        width: 100%;
        height: auto;
    }
}

/* main ======================================================= */
.main h1.title {
border-bottom: #BBBBBB 2px solid;
color: #000;
font-size: 22px;
font-weight: normal;
text-align: center;
padding: 0 0 20px;
margin: 0 10px;
}
/* footer ===================================================== */
#footer {
clear: both;
position: relative;
width: 100%;
background: #35312C;
color: #FFFFFF;
font-size: 12px;
line-height: 1.7;
padding: 10px 0 12px;
}
#footer #map {
height: 280px;
margin: 0 20px 46px;
}
#footer h1 {
margin: 0 0 20px 18px;
}
#footer p.add {
margin: 0 0 18px 18px;
}
#footer ul {
margin-left: 18px;
}
#footer ul li {
padding-bottom: 10px;
}
#footer ul li:before {
content: ">> ";
}
#copyright {
clear: both;
display: block;
width: 100%;
height: 60px;
line-height: 60px;
background: #2F2B2A;
font-family: Arial, Helvetica, sans-serif;
color: #ABA6A0;
font-size: 12px;
text-align: center;
}
#footer a:link,
#footer a:visited { color: #FFFFFF; text-decoration: none;}
#footer a:hover,
#footer a:active { color: #FFFFFF; text-decoration: underline;}
#footer .add a:link,
#footer .add a:visited { text-decoration: underline;}
#footer .add a:hover,
#footer .add a:active { text-decoration: none;}
/* ---------------------------------------------------------------
8888888 8888888888 8 888888888o   
      8 8888       8 8888    `88. 
      8 8888       8 8888     `88 
      8 8888       8 8888     ,88 
      8 8888       8 8888.   ,88' 
      8 8888       8 8888888888   
      8 8888       8 8888    `88. 
      8 8888       8 8888      88 
      8 8888       8 8888    ,88' 
      8 8888       8 888888888P   
--------------------------------------------------------------- */
@media screen and (min-width: 600px) {
br.sp {
display: none;
}
/* main ======================================================= */
.main h1.title {
padding: 20px 0 20px;
}
/* footer ===================================================== */
#footer {
padding: 10px 0 22px;
}
#footer h1 {
margin: 0 0 20px 68px;
}
#footer p.add {
margin: 0 0 28px 68px;
}
#footer ul {
float: left;
margin-left: 68px;
}
}
/* ---------------------------------------------------------------
8 888888888o       ,o888888o.     
8 8888    `88.    8888     `88.   
8 8888     `88 ,8 8888       `8.  
8 8888     ,88 88 8888            
8 8888.   ,88' 88 8888            
8 888888888P'  88 8888            
8 8888         88 8888            
8 8888         `8 8888       .8'  
8 8888            8888     ,88'   
8 8888             `8888888P'     
--------------------------------------------------------------- */
@media screen and (min-width: 960px) {
html { overflow-y: scroll;}
html, body {
min-width: 1264px;
}
body {
padding-top: 0;
}
/* header ===================================================== */
#header {
width: 220px;
height: 100%;
}
#header #nav {
position: relative;
top: 20px;
width: auto;
height: auto;
}
#header #nav li {
position: relative;
width: 200px;
opacity: 1;
}
#header #nav li:hover:after {
position: absolute;
top: 17px;
right: 10px;
display: block;
content: "";
width: 7px;
height: 7px;
border-top: 1px solid #444;
border-right: 1px solid #444;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
#navToggle {
display: none;
}
#info {
width: 100%;
padding: 16px 0 12px 240px;
}
#info dl {
display: table;
width: 1024px;
overflow: hidden;
}
#info dt {
display: table-cell;
vertical-align: middle;
padding-bottom: 4px;
margin: 0;
}
#info dd {
padding-left: 40px;
padding-right: 12px;
}
/* main ======================================================= */
.main {
width: 1024px;
padding-left: 240px;
}
.main h1.title {
padding: 5px 0 20px;
margin: 0;
}
/* footer ===================================================== */
#footer {
padding: 10px 0 0 240px;
}
#footer .inner {
position: relative;
width: 1024px;
height: 530px;
}
#footer #map {
width: 1024px;
margin: 0 0 46px;
}
#footer h1 {
margin: 0 0 20px 84px;
}
#footer p.add {
margin: 0 0 18px 124px;
}
#footer ul {
position: absolute;
top: 348px;
margin: 0;
}
#footer ul.global {
left: 472px;
}
#footer ul.link {
left: 707px;
}
#copyright span {
display: block;
width: 1024px;
padding-left: 240px;
}
}
/* ---------------------------------------------------------------
8 888888888o       ,o888888o.     
8 8888    `88.    8888     `88.   
8 8888     `88 ,8 8888       `8.        /$$
8 8888     ,88 88 8888                 | $$ 
8 8888.   ,88' 88 8888               /$$$$$$$$
8 888888888P'  88 8888              |__  $$__/
8 8888         88 8888                 | $$  
8 8888         `8 8888       .8'       |__/   
8 8888            8888     ,88'   
8 8888             `8888888P'     
--------------------------------------------------------------- */
@media screen and (min-width: 1264px) {
html, body {
min-width: 100%;
}
/* header ===================================================== */
#info dl {
margin: 0 auto;
}
/* main ======================================================= */
.main {
margin: 0 auto;
}
/* footer ===================================================== */
#footer .inner,
#copyright span {
margin: 0 auto;
}
}