/*--------------------------------------------------------------------------------

共通/common

--------------------------------------------------------------------------------*/


.wrapper {
    width: 960px;
    margin: auto;
}

.col_l {
    float: left;
}

.col_r {
    float: right;
}


/*--------------------------------------------------------------------------------

ヘッダー/header

--------------------------------------------------------------------------------*/

#gheader {
    position: relative;
    padding: 30px 0 40px;
    box-shadow: 0px 5px 5px 0.25px rgba(6, 0, 1, 0.2);
    background: #fff;
    z-index: 9999;
}

#gheader .wrapper {
    position: relative;
}

#gnav {
    position: absolute;
    top: 0.25em;
    right: 0;
}

#gnav ul {
    font-size: 0;
}

#gnav li {
    display: inline-block;
    font-size: 16px;
    margin-right: 1em;
}

#gnav li:last-child {
    margin-right: 0;
}

#gnav li a {
    font-weight: bold;
    color: #303f9f;
    transition: 0.3s all ease-in;
}

#gnav li a:hover {
    opacity: 0.7;
    transition: 0.3s all ease-out;
}

/*--------------------------------------------------------------------------------

コンテンツ/content

--------------------------------------------------------------------------------*/
.top_image {
    width: 100%;
}

.top_image img {
    width: 100%;
}

#mainArea {
    font-size: 18px;
}

.common#mainArea {
    display: block;
    background: #303f9f;
    font-size: 18px;
    line-height: 1.5em;
    zoom: 1;
}

/*------ 最新情報/ニュース/news ---------------------------------------------------*/

#news {
    padding: 50px 0 70px;
    background: #ffffff;
}

#news h2 {
    margin-bottom: 18px;
}

#news .news_list li {
    padding: 20px;
    border-bottom: 1px solid #303f9f;
    font-size: 18px;
    color: #303f9f;
    line-height: 1em;
}

#news .news_list li:first-child {
    border-top: 1px solid #303f9f
}

#news .news_list a {
    color: #303f9f;
}

#news .news_list li time {
    margin-right: 1em;
}

#news .news_list li span {
    margin-right: 1em;
    padding: 5px 10px;
    font-size: 14px;
    background: #303f9f;
    color: #ffffff;
}

#news .news_list li a {
  color: #303f9f;
  text-decoration: underline;
  transition: 0.3s all ease-in;
}

#news .news_list li a:hover {
  opacity: 0.7;
  transition: 0.3s all ease-in;
}

/*------ 部門紹介/section/ ---------------------------------------------------*/

#top_section {
    padding: 70px 0 70px;
    background: #303f9f;
    color: #ffffff;
}

#top_section h2 {
    margin-bottom: 18px;
}

#top_section h3 {
    margin-bottom: 18px;
    font-size: 24px;
    line-height: 1em;
}

.top_section_list li {
    margin-bottom: 70px;
}

.top_section_list li:last-child {
    margin-bottom: 0;
}

.top_section_list .col_l {
    position: relative;
    width: 460px;
    min-height: 210px;
}

.top_section_list .btn_link {
    display: inline-block;
    position: absolute;
    right: 0;
    bottom: 0;
    font-size: 18px;
    background: #ffffff;
    color: #303f9f;
    border: 1px solid #ffffff;
    padding: 5px 10px;
    transition: 0.3s all ease-in;
}

.top_section_list .btn_link:hover {
    color: #ffffff;
    background: #303f9f;
    box-shadow: 0px 5px 7px 0.25px rgba(0, 0, 0, 0.2);
    transition: 0.3s all ease-out;
}

.top_section_list .col_r {
    width: 460px;
}

#introduction h3 {
    margin-bottom: 30px;
    font-size: 36px;
    color: #303f9f;
}

#introduction {
    padding-bottom: 50px;
    background: #303f9f;
}

#introduction img {
    width: 100%;
}

#introduction .col_l,
#introduction .col_r {
    width: 50%;
    text-align: center;
    height: 400px;
    background: #ffffff;
}

#introduction .ph_company {
    background: url(../../image/top_company.jpg) no-repeat;
    background-size: cover;
}

#introduction .ph_equip {
    background: url(../../image/top_equip.jpg) no-repeat;
    background-size: cover;
}

#introduction .box {
    position: relative;
    box-sizing: border-box;
    padding: 30px 0 50px;
    color: #303f9f;
}

#introduction .btn_link {
    display: inline-block;
    width: 170px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 50px;
    margin: auto;
    padding: 25px 15px;
    background: #303f9f;
    line-height: 1em;
    color: #ffffff;
    border: 1px solid #303f9f;
    font-size: 16px;
    transition: 0.3s all ease-in;
}

#introduction .btn_link:hover {
    color: #303f9f;
    background: #ffffff;
    box-shadow: 0px 5px 5px 0.25px rgba(6, 0, 1, 0.2);
    transition: 0.3s all ease-out;
}

/*--------------------------------------------------------------------------------

一般/common

--------------------------------------------------------------------------------*/

.common {
    padding: 50px 0;
    color: #ffffff;
}

.common h2 {
    font-size: 32px;
    margin-bottom: 30px;
}

/*--------------------------------------------------------------------------------

会社案内/company

--------------------------------------------------------------------------------*/

.company #message {
    margin-bottom: 60px;
}

.company #message .col_l {
    width: 480px;
}

.company #message .col_r {
    width: 460px;
}

.company #feature {
    margin-bottom: 60px;
}

.company #feature p {
    margin-bottom: 50px;
}

.company .col_l {
    width: 460px;
}

.company .col_l a {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    font-size: 16px;
}

.company #overview {
    margin-bottom: 70px;
}

.company #overview .col_l {
    text-align: right;
}

.company .overview_table {
    text-align: left;
    border: 1px solid #ffffff;
    font-size: 16px;
}

.company .overview_table tr {
    border-bottom: 1px solid #ffffff;
}

.company .overview_table th,
.company .overview_table td {
    padding: 10px;
}

.company .overview_table th {
    width: 130px;
    border-right: 1px solid #ffffff;
}

.company .col_r {
    width: 460px;
}

.company .office_list li {
    margin-bottom: 1em;
}

.company .profile_box {
    position: relative;
    margin-bottom: 50px;
    padding-left: 90px;
    font-size: 16px;
}

.company .profile_box:last-child {
    margin-bottom: 0;
}

.company .profile_box h3 {
    position: absolute;
    left: 0;
    top: 0;
}

.company .history_list {
    font-size: 0;
}

.company .history_list span {
    width: 240px;
    font-size: 16px;
    display: inline-block;
    vertical-align: top;
}

.company .history_list .time {
    width: auto;
    margin-right: 1em;
}

.company #access {
    text-align: center;
}

.map_btn {
    width: 280px;
    margin: 0 auto;
    margin-bottom: 50px;
    padding: 0;
    text-align: center;
    border: 1px solid #ffffff;
}

.map_btn li {
    box-sizing: border-box;
    display: inline-block;
    width: 140px;
    margin: 0;
    padding: 0;
    font-size: 18px;
    vertical-align: top;
    line-height: 1em;
}

.map_btn li a {
    display: block;
    color: #ffffff;
    padding: 7px;
}

.map_btn li a.active {
    background: #ffffff;
    color: #303f9f;
}

.company .map_canvas {
    display: none;
    width: 100%;
    height: 350px;
    background: #ccc;
}

.company .map_canvas.active {
    display: block;
}

/*--------------------------------------------------------------------------------

部門紹介/section

--------------------------------------------------------------------------------*/

#material {
    margin-bottom: 100px;
}

#material .material_image {
    margin: 50px 0 30px;
}

#material .stock_list {
    margin-bottom: 30px;
}

#material .stock_list .col_l,
#material .stock_list .col_r {
    width: 465px;
}

#material .stock_list table {
    width: 100%;
    background: #ffffff;
    border: 1px solid #434343;
    color: #000000;
    font-size: 14px;
}

#material .stock_list h3 {
    font-size: 20px;
    margin-bottom: 15px;
}

#material .stock_list table tr {
    border-bottom: 1px solid #434343;
}

#material .stock_list table th,
#material .stock_list table td {
    border-right: 1px solid #434343;
    line-height: 1em;
    padding: 5px;
}

#material .stock_list table th {
    font-size: 16px;
    font-weight: bold;
}

#material .btn_link {
    display: inline-block;
    position: relative;
    color: #ffffff;
    margin-top: 0.8em;
    margin-left: 1.4em;
    border-bottom: 1px solid #ffffff;
    font-size: 16px;
    line-height: 1em;
}

#material .btn_link:before {
    position: absolute;
    left: -1em;
    bottom: -2px;
    font-size: 1.4em;
}

.section .applicate h3 {
    font-size: 20px;
    margin-bottom: 20px;
}

#process .process_image {
    margin: 50px 0 30px;
}

#process {
    margin-bottom: 100px;
}

#sale {
    margin-bottom: 150px;
}

/*--------------------------------------------------------------------------------

仕入先/supplier

--------------------------------------------------------------------------------*/

.supplier {
    padding-bottom: 110px;
}

.supplier .sup_list {
    font-size: 0;
    margin-bottom: 20px;
}

.supplier .sup_list h3 {
    font-size: 24px;
    margin-bottom: 18px;
}

.supplier .sup_list li {
    display: inline-block;
    width: 460px;
    margin-right: 40px;
    margin-bottom: 40px;
    font-size: 16px;
    vertical-align: top;
}

.supplier .sup_list li:nth-child(2n) {
    margin-right: 0;
}

.supplier .sup_list li:nth-last-child(2),
.supplier .sup_list li:last-child {
    margin-bottom: 0;
}

.supplier .sup_list li .col_l a {
    display: block;
    transition: 0.3s all ease-in;
}

.supplier .sup_list li .col_l a:hover {
    box-shadow: 0px 3px 7px 7px rgba(0, 0, 0, 0.3);
    transition: 0.3s all ease-out;
}

.supplier .sup_list li .col_r {
    width: 200px;
}

.supplier .sup_list li p {
    line-height: 1.5em;
}

.supplier .sup_list .btn_link {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    transition: 0.3s all ease-in;
}

.supplier .sup_list .btn_link:hover {
    opacity: 0.7;
    transition: 0.3s all ease-out;
}

/*--------------------------------------------------------------------------------

お問い合わせ/contact/コンタクト

--------------------------------------------------------------------------------*/

.contact h3 {
    font-size: 24px;
    margin-bottom: 20px;
}

.contact_list {
    list-style: disc;
    margin-left: 1.5em;
    margin-bottom: 50px;
}

.contact_table {
    width: 100%;
    margin-bottom: 50px;
    background: #ffffff;
    color: #434343;
}

.contact_table tr {
    border-bottom: 1px solid #757575;
}

.contact_table th,
.contact_table td {
    border-right: 1px solid #757575;
    padding: 12px;
    line-height: 1em;
    font-size: 18px;
    vertical-align: top;
}

.contact_table th {
    width: 250px;
    padding-top: 16px;
}

.contact_table th span {
    font-size: 0.7em;
    margin-left: 0.5em;
    padding: 3px;
    background: #ff0000;
    border-radius: 3px;
    color: #ffffff;
}

.contact .privacy_area {
    text-align: center;
}

.contact .privacy_box {
    height: 250px;
    margin-bottom: 20px;
    border: 1px solid #434343;
    background: #ffffff;
    padding: 15px;
    color: #434343;
    text-align: left;
    font-size: 0.8em;
    line-height: 1.5em;
    overflow-y: scroll;
}

.contact .privacy_box h5 {
    font-size: 1.2em;
    line-height: 1em;
    color: #303f9f;
    margin-bottom: 1.2em;
}

.contact .privacy_box p {
    margin-bottom: 2em;
}

.contact .privacy_box ul {
    margin-top: -0.5em;
    margin-bottom: 2em;
    margin-left: 1.5em;
    list-style: disc;
}

.contact #contact_form button {
    display: block;
    width: 150px;
    height: 50px;
    margin: auto;
    margin-top: 40px;
    font-size: 18px;
    background: #ffffff;
    color: #303f9f;
    border: none;
    border: 1px solid #ffffff;
    cursor: pointer;
    transition: 0.3s all ease-in;
}

.contact #contact_form button:hover {
    background: #303f9f;
    color: #ffffff;
    transition: 0.3s all ease-out;
}

.contact #contact_form input[type="text"],
.contact #contact_form input[type="email"],
.contact #contact_form input[type="tel"],
.contact #contact_form textarea {
    width: 100%;
    border: 1px solid #757575;
    border-radius: 5px;
    box-sizing: border-box;
    padding: 5px;
    font-size: 0.8em;
}

.contact #contact_form input[type="text"], 
.contact #contact_form input[type="email"],
.contact #contact_form input[type="tel"] {
    height: 30px;
}

.contact #contact_form textarea {
    min-height: 250px;
    resize: vertical;
}

.contact #contact_form input[type="checkbox"] {
    display: none;
}

.contact #contact_form input[type="checkbox"] + label {
    position: relative;
}

.contact #contact_form input[type="checkbox"] + label:before {
    content: '';
    display: block;
    width: 1.2em;
    height: 1.2em;
    position: absolute;
    left: -1.5em;
    border: 2px solid #ffffff;
}
/*
.contact #contact_form input[type="checkbox"] + label:after {
    content: '';
    display: block;
    width: 0.9em;
    height: 0.9em;
    position: absolute;
    top: 0.05em;
    left: -1.25em;
    background: rgba(255, 255, 255, 0);
    border-radius: 50%;
    transition: 0.3s all ease-in;
}

.contact #contact_form input[type="checkbox"]:checked + label:after {
    background: #ffffff;
    transition: 0.3s all ease-out;
}
*/
.contact #contact_form input[type="checkbox"] + label:after {
    content: '';
    display: block;
    width: 0.8em;
    height: 1.2em;
    position: absolute;
    bottom: 0.4em;
    left: -1.4em;
    border: 5px solid #ffffff;
    border-top: 5px solid transparent;
    border-left: 5px solid transparent;
    border-radius: 3px;
    transform: rotate(45deg);
    opacity: 0;
    transition: 0.3s all ease-in;
}

.contact #contact_form input[type="checkbox"]:checked + label:after {
    opacity: 1;
    transition: 0.3s all ease-out;
}

/*--------------------------------------------------------------------------------

フッター/footer

--------------------------------------------------------------------------------*/

.equip h3 {
    font-size: 24px;
    margin-bottom: 20px;
}

.equip .equip_table {
    width: 100%;
    margin-bottom: 30px;
    background: #ffffff;
    border: 1px solid #434343;
    color: #000000;
    font-size: 18px;
}

.equip .equip_table:last-child {
    margin-bottom: 80px;
}

.equip .equip_table tr {
    border-bottom: 1px solid #434343;
}

.equip .equip_table th,
.equip .equip_table td {
    border-right: 1px solid #434343;
    padding: 10px;
}

.equip .equip_table td:first-child {
    width: 300px;
}

.equip .equip_table td:nth-child(2) {
    width: 100px;
}

/*--------------------------------------------------------------------------------

フッター/footer

--------------------------------------------------------------------------------*/

footer {
    padding: 20px 0 0;
    box-shadow: 0px -5px 5px 0.25px rgba(6, 0, 1, 0.2);
}

footer h1 {
    margin-bottom: 60px;
}

footer .col_l {
    width: 50%;
}

footer address {
    display: block;
    font-size: 0;
    color: #303f9f;
}

footer address span {
    display: block;
    font-size: 16px;
}

footer address p {
    display: inline-block;
    width: 50%;
    font-size: 14px;
    vertical-align: top;
}

.f_sitemap {
    font-size: 0;
}

.f_sitemap h3 {
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: bold;
    line-height: 1em;
}

.f_sitemap h3 a {
    color: #303f9f;
    border-bottom: 1px solid #303f9f;
}

.f_sitemap > li {
    display: inline-block;
    margin-right: 25px;
    font-size: 14px;
    vertical-align: top;
}

.f_sitemap > li:last-child {
    margin-right: 0;
}

.f_sitemap > li a {
    color: #303f9f;
    border-bottom: 1px solid #303f9f;
    transition: 0.3s all ease-in;
}

.f_sitemap > li a:hover {
    text-shadow: 0 5px 7px rgba(0, 0, 0, 0.3);
    transition: 0.3s all ease-out;
}

.f_sitemap > li li {
    line-height: 1em;
    margin-bottom: 12px;
}

footer small {
    display: block;
    margin: 40px 0 10px;
    text-align: center;
    font-size: 14px;
    line-height: 1em;
    color: #303f9f;
}