@charset "utf-8";

/* common
============================================================ */
*, *::after, *::before {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  overflow-y:scroll;
  overflow-x:hidden;
}

body {
  font-size: 1.6rem;
  background-color: #22283f;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight:500;
}
body::before {
  content: '';
  display: none;
}

a {
  color: #000;
  text-decoration: none;
}

.header::after, .menu::after, .util::after, .bussiness_box::after, .b_slider_nav::after, 
.ft_box::after, .ceo_cont::after, .inner::after, .his_list_box::after, .his_list_box dd::after, .location_box::after, .buss_cont_box::after,
.his_list_box:after, .his_list_box li:after, .his_list_box dl:after, .tab_box ul::after {content:""; display:block; clear:both;}
.inner {position:relative; margin:0 auto; width:1200px;}

/* header
============================================================ */
.header {position:absolute; top:0; right:0; left:0; padding:0 20px; height:80px; z-index:3;}
.header::before {content:""; display:block; position:absolute; bottom:0; left:0; right:0; border-bottom:1px solid #fff; opacity:.2;}
.header > * {vertical-align:middle;}
.header h1 {float:left; position: relative; z-index:1;}
.header .logo {display:block; width:200px; height:80px; font-size:0; text-indent:-99999999px; background:url(../img/comm/img_logo_1.png) no-repeat center;}
.header .nav_box {float:right;}
.header .nav_box > * {float:left;}
.header .nav_box .menu {position:relative;}
.header .nav_box .menu > li {position:relative; float:left; width:160px; line-height:80px; text-align:center; z-index:1;}
.header .nav_box .menu > li > a {color:#fff; font-size:18px; font-weight:600;}
.header .nav_box .menu > li > a:hover {color:#df4242;}
.dep {display:none; position:absolute; padding:10px 0 0; height:273px; line-height:normal; border-right:1px solid #ddd; z-index:2;}
.dep.first {border-left:1px solid #ddd;}
.dep li {width:150px; height:50px; line-height:50px; text-align:center;}
.dep li a {color:#000; font-weight:500;}
.dep li a:hover {color:#df4242;}
.dep_bg {display:none; position:absolute; top:79px; left:0; width:100%; height:275px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; background-color:#fff;z-index:0;}
.header .nav_box .util {position:relative; margin:22px 0 0 30px; z-index:1;}
.header .nav_box .util a {float:left; width:100px; height:36px; line-height:36px; border-radius:50px; text-align:center; font-size:12px; font-weight:600;}
.header .nav_box .util a.btn_catalog {color:#fff; background-color:#df4242;}
.header .nav_box .util a.btn_sitemap {margin-left:15px; color:#000; background-color:#fff;}

.header.st2 {background-color:#fff; transition:.3s;}
.header.st2::before {border-color:#000; opacity:.1;}
.header.st2 .logo {background-image:url(../img/comm/img_logo_2.png)}
.header.st2 .nav_box .menu a {color:#000;}
.header.st2:hover .nav_box .menu > li > a:hover {color:#df4242;}
.header.st2 .nav_box .util a.btn_sitemap {border:1px solid #000; line-height:33px; }

.header.st1:hover {background-color:#fff; transition:.2s;}
.header.st1:hover .logo {background-image:url(../img/comm/img_logo_2.png)}
.header.st1:hover .nav_box .menu a {color:#000;}
.header.st1:hover .nav_box .menu > li > a:hover {color:#df4242;}
.header.st1:hover .nav_box .util a.btn_sitemap {border:1px solid #000; line-height:33px; }
.header.st1:hover .dep li a:hover {color:#df4242;}


/* table
============================================================ */
.tb1 {width:100%; border-top:2px solid #4d4d4d; table-layout:fixed; border-collapse: separate;}
.tb1 th, .tb1 td {padding:20px; border-bottom:1px solid #ccc; font-size:17px; text-align:center; vertical-align:middle;}
.tb1 th {background-color:#f2f2f2; vertical-align:middle;}
.tb1 td {font-weight:300;}
.tb1 td.al {text-align:left;}
.tb1 td.lin {border-left:1px solid #ccc;}

.tb2 {width:100%; border-top:2px solid #4d4d4d; table-layout:fixed; border-collapse: separate;}
.tb2 th, .tb2 td {padding:10px; border-bottom:1px solid #ccc; font-size:17px; text-align:center; vertical-align:middle;}
.tb2 th {background-color:#f2f2f2; vertical-align:middle;}
.tb2 td {font-weight:300; text-align:left;}
.tb2 td.lin {border-left:1px solid #ccc;}

.tb1.pd td {padding:5px;}

/* footer
============================================================ */
.ft_box {position:relative; padding:10px 50px; background-color:#f2f2f2;}
.ft_box .ft_logo {display:block; float:left; width:200px; height:90px; font-size:0; text-indent:-99999999px; background:url(../img/comm/img_logo_3.png) no-repeat center;}
.ft_box .ft_address {float:right; padding-top:30px; text-align:right; color:#999; font-size:15px;}
.ft_box .ft_address li {display:inline-block; margin-left:15px; color:#999;}
.ft_box .ft_address li strong, .ft_box .ft_address li span {display:inline-block;}
.ft_box .ft_address li span {display:inline-block; margin-left:5px; font-weight:300;}
.ft_box .ft_address .ft_copy {padding-top:10px;}

/* mobile menu
============================================================ */
.navigation {display:none; position:absolute; top:0; right:0; width:80px; height:80px; z-index:3;}
#menuToggle {display: flex; flex-direction: column; position:relative; top:0; right:0; padding-top:30px; width:100%; height:100%; z-index: 3; -webkit-user-select: none; user-select: none;}
#menuToggle input {display:flex; position:absolute; top:0; margin:0; width:100%; height:100%; cursor: pointer; opacity:0; z-index: 2;}
#menuToggle span {display: flex; margin:0 auto; width:30px; height: 3px; margin-bottom: 5px; position: relative; background-color:#fff; border-radius:3px; z-index: 1; transform-origin: 5px 0px;
transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            opacity 0.55s ease;
}
#menuToggle span:first-child {transform-origin: 0% 0%;}
#menuToggle span:nth-last-child(2) {transform-origin: 0% 100%;}
#menuToggle input:checked ~ span {opacity: 1; transform: rotate(45deg) translate(-3px, 0); background-color:#fff;}
#menuToggle input:checked ~ span:nth-last-child(3) {opacity:0; transform: rotate(0deg) scale(0.2, 0.2);}
#menuToggle input:checked ~ span:nth-last-child(2) {transform: rotate(-45deg) translate(0, -1px);}
.header_box {position:absolute; top:0; right:0; width:50%; height:80px; background-color:#47515a; z-index:1;}
#m_menu {position: fixed; top:0; right:-100px; width:0; height:100vh; background-color:rgba(0, 0, 0, .7); transition:.2s;}
#m_menu > ul {position:absolute; right:0; top:0; height:100vh; padding:80px 0 30px; width:50%; text-align:center; background-color:#fff;}
#m_menu > ul > li {transition-delay:2s;}
#menuToggle input:checked ~ #m_menu {width:100%; right:0; transition:.2s;}
#m_menu > ul > li a {display:block; color:#000;}
#m_menu > ul > li > a {position:relative; padding:2rem; font-size:1.7rem; font-weight:600; border-bottom:1px solid #ddd; text-align:left;}
#m_menu > ul > li li a {padding:1.5rem 2rem; font-size:1.6rem; font-weight:300; text-align:left;}
#m_menu > ul > li li a::before {content:"-"; display:inline-block; margin:-2px 5px 0 0;}
#m_menu > ul ul {padding:10px 0; border-radius:3px; background-color:#f3f3f3;}
#m_menu .m_dep {display:none;}
.btn_home {display:block; width:80px; height:80px; font-size:0; text-indent:-9999px; background:url(../img/sub/ico_manu_home.png) no-repeat center; background-size:40px;}