/* ------------------------------
 common2 for HD/FT EN
------------------------------ */
@import url(//fonts.googleapis.com/css?family=Oswald:400,500,700,300&subset=latin,latin-ext);

/* for local navi */
#category-menu.navbar-category {
    position: fixed;
    z-index: 999;
}
@media screen and (max-width: 1239px) {
    #category-menu.navbar-category {
        top: 70px;
    }
    main {
        margin-top: 70px;
    }
    #category-menu.navbar-category + main {
        margin-top: 110px;
    }
    /* for local navi(IR) */
    body.fixed .local-menu {
        top: 40px;
    }
}
@media screen and (min-width: 1240px) {
    #category-menu.navbar-category {
        top: 100px;
    }
    main {
        margin-top: 100px;
    }
    #category-menu.navbar-category + main {
        margin-top: 140px;
    }
    /* for local navi(IR) */
    body.fixed .local-menu {
        top: 70px;
    }
}
/* HD/FT style */
header#header, minisite-block, footer {
    font-family: 'Helvetica Neue',Arial,Helvetica,sans-serif;
    font-size:10px;
    line-height: 1.75;
}
.header-block ol, .header-block ul,
.global-footer-wrapper ol, .global-footer-wrapper ul {
    list-style: none;
}
.header-block button, .global-footer-wrapper button {
    border-style: none;
}
.header-block ul li a:hover {
    color: #333;
}
.footer-navigation a:hover {
    color: #fff;
}
/* Image size */
.col-block figure img,
.col-block picture img {
    width: 100%;
}
/* for SNS Icon */
.col-block, .col-line-box a.link-group {
    display: flex;
    flex-flow: row wrap;
}
.sns-group h4 {
    margin-top: 0;
    line-height: 1.75;
    font-weight: 500;
}
/* for icon-c */
.icon-c {
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    margin-right: 10px;
    position: relative;
    transition: 0.15s ease-in-out;
}
.icon-c.circl-blank::before {
    background: url(/_common2/images/icon_blank-m.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-blank::after {
    opacity: 0;
    background: url(/_common2/images/icon_blank-m_violet.svg) no-repeat 0 0 / cover;
}
.icon-c::before, .icon-c::after {
    content: "";
    width: 30px;
    height: 30px;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.15s ease-in-out;
}
.icon-c.circl-arrow::before {
    background: url(/_common2/images/icon_arrow-m.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-arrow-b::before {
    background: url(/_common2/images/icon_arrow-m-b.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-pdf::before {
    background: url(/_common2/images/icon_pdf-m.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-blank::before {
    background: url(/_common2/images/icon_blank-m.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-file::before {
    background: url(/_common2/images/icon_file-m.svg) no-repeat 0 0 / cover;
}
.icon-c.circl-zoom::before {
    background: url(/_common2/images/icon_zoom-m.svg) no-repeat 0 0 / cover;
}
@media print, screen and (min-width: 768px) {
    /* hover */
    .icon-c {
        transition: 0.15s ease-in-out;
    }
    /* for hover icon */
    .icon-c.circl-arrow::after {
        opacity: 0;
        background: url(/_common2/images/icon_arrow-m_violet.svg) no-repeat 0 0 / cover;
    }
    .icon-c.circl-arrow-b::after {
        opacity: 0;
        background: url(/_common2/images/icon_arrow-m-b_violet.svg) no-repeat 0 0 / cover;
    }
    .icon-c.circl-pdf::after {
        opacity: 0;
        background: url(/_common2/images/icon_pdf-m_violet.svg) no-repeat 0 0 / cover;
    }
    .icon-c.circl-blank::after {
        opacity: 0;
        background: url(/_common2/images/icon_blank-m_violet.svg) no-repeat 0 0 / cover;
    }
    .icon-c.circl-file::after {
        opacity: 0;
        background: url(/_common2/images/icon_file-m_violet.svg) no-repeat 0 0 / cover;
    }
    .icon-c.circl-zoom::after {
        opacity: 0;
        background: url(/_common2/images/icon_zoom-m_violet.svg) no-repeat 0 0 / cover;
    }
    .header-block a:hover .icon-c::before, 
    .header-block a:focus .icon-c::before {
        opacity: 0;
    }
    .header-block a:hover .icon-c::after,
    .header-block a:focus .icon-c::after {
        opacity: 1;
    }
}
/* ----------------
for PC CSS
----------------- */
@media print, screen and (min-width: 768px) {
    .full-wide {
        width: 100%;
        /* max-width: 1600px; */
    }
    .contents-block {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 110px;
    }
    .col-block:not(.no-gap), .col-line-box a {
        gap: 32px 32px;
    }
    .col-block:not(.no-gap) > .col_1-2 {
        max-width: 678px;
    }
    .col_5-6 { width: calc((100% - 160px) / 6 * 5 + 128px);}
    .col_3-4 { width: calc((100% - 96px) / 4 * 3 + 64px);}
    .col_2-3 { width: calc((100% - 64px) / 3 * 2 + 32px);}
    .col_1-2 { width: calc((100% - 32px) / 2);}
    .col_1-3 { width: calc((100% - 64px) / 3);}
    .col_1-4 { width: calc((100% - 96px) / 4);}
    .col_1-6 { width: calc((100% - 160px) / 6);}
    .col_1-12 { width: calc((100% - 352px) / 12);}

    .col_7-12 { width: calc((100% - 352px) / 12 * 7 + 192px); max-width: 710px; }
    .col_5-12 { width: calc((100% - 352px) / 12 * 5 + 128px); max-width: 498px; }

    /* hover image */
    .header-block a .img-hover {
        overflow: hidden;
        display: block;
        position: relative;
    }
    .header-block a .img-hover img {
        display: block;
        transition-duration: 0.3s;
        overflow: hidden;
        display: block;
        width: 100%;
    }
    .header-block a:hover .img-hover img,
    .header-block a:focus .img-hover img {
        opacity: 1;
        overflow: hidden;
        transform: scale(1.1);
        transition-duration: 0.3s;
    }
}
/* ----------------
for SP CSS
----------------- */
@media print, screen and (max-width: 767px) {
    .full-wide .contents-row.contents-inner {
        padding-left: 16px;
        padding-right: 16px;
    }
    .contents-block {
        margin-bottom: 60px;
    }
    .col-block:not(.no-gap):not(.gap-m),
    .col-line-box a {
        gap: 45px 16px;
    }
    .col_5-6, .col_3-4, .col_2-3, .col_1-2, .col_1-3, .col_5-12, .col_7-12, .sp_w100,
    .col-block.col_2 > *, .col-block.sp_w100.col_3 > *, .col-block.sp_w100.col_4 > * {
        width: 100%;
    }
    .col_1-4:not(.sp_w100), .col_1-6:not(.sp_w100), .col_1-12:not(.sp_w100),
    .col-block.sp-no-change > .col_1-2,
    .col-block > .sp-col_1-2 {
        width: calc((100% - 16px) / 2);
    }
    .col-block.sp-no-change > .col_1-3 {
        width: calc((100% - 32px) / 3);
    }
    .col-block.sp-no-change > .col_1-4 {
        width: calc((100% - 48px) / 4);
    }
    .icon-c,
    .icon-c::before,
    .icon-c::after {
        width: 26px;
        height: 26px;
    }
}
