@charset "UTF-8";

@media screen and (min-width: 768px) {
    html {
        line-height: 2.20142857;
        letter-spacing: .2em;
    }
    html.isIE {
        letter-spacing: .1em;
    }
    .topic_figure .txt,
    .news-type,
    .news-link,
    .news-detail .txt,
    .privacy-section,
    .sub-privacy-section {
        line-height: 1.9;
    }
}

@media screen and (max-width: 767px) {
    html,
    .topic_figure .txt,
    .news-type,
    .news-link,
    .news-detail .txt,
    .privacy-section,
    .sub-privacy-section {
        line-height: 1.33068562;
    }
}

.txt{color:#2c2d30}
.red{color:#e52d27}
.gr1{color:#616266}
.gr2{color:#b6b7ba}
.gr3{color:#e3e4e6}

/* ==========================================================================
   Parente
   ========================================================================== */

#wrapper {
    visibility: hidden;
    opacity: 0;
    overflow: hidden;
    width: 100%;
}

.loaded #wrapper {
    visibility: visible;
    opacity: 1;
}

@media screen and (min-width: 768px) {
    #wrapper {
        min-width: 1024px;
    }
}

/* ==========================================================================
   section
   ========================================================================== */

section, .with-bg {
    position: relative;
    text-align: center;
}
#visual + section {
    margin-top: -1px;
}

.section_inner {
    z-index: 1;
    position: relative;
    width: 100%;
    max-width: 1024px;
    margin: 0 auto;
}
.section_inner > :first-child {
    margin-top: 0;
}
.section_inner > :last-child {
    margin-bottom: 0;
}

@media screen and (max-width: 767px) {
    #visual + section {
        padding-top: 1em;
    }
    #visual.home-visual + section {
        padding-top: 0;
    }
    .section_inner {
        padding-right: 32px;
        padding-left: 32px;
    }
}

/* :::::: section_title :::::: */

.section_title {
    z-index: 1;
    position: relative;
    margin-bottom: 40px;
    color: #a4a4a9;
    line-height: 1.2;
    text-align: center;
}
.section_title.white {
    color: #fff;
}
.section_title span {
    display: block;
}
.section_title .en {
    font-size: 4.8rem;
    -moz-font-feature-settings: "liga" 1;
    font-feature-settings: "liga" 1;
}
.section_title.small .en {
    margin-bottom: .3em;
    font-size: 3rem;
}
.section_title .ja {
    font-size: 1.5rem;
}

.section_title.normal {
    margin-bottom: 40px;
}
.section_title.normal .en {
    margin-bottom: .3em;
    color: #2c2d30;
    font-size: 3.2rem;
}
.section_title.normal .ja {
    color: #767779;
    font-size: 1.6rem;
}

/* :::::: section_lead :::::: */

.section_lead {
    margin: 0 0 16px;
    color: #2c2d30;
    font-size: 2.1rem;
    line-height: 1.6;
    letter-spacing: .35rem;
    font-weight: normal;
}
.section_lead:empty {
    display: none;
}
.section_lead .bg_white{
	background-color: rgba(237,238,237,0.8);
	padding:3px 10px;
}
p .bg_white{
	background-color: rgba(237,238,237,0.8);
	padding:3px 10px;
}

/* :::::: with-bg section :::::: */

.with-bg {
    height: 595px;
}

.with-bg svg.bg,
.with-bg .bg-mask {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1366px;
    margin-left: -683px;
}
.isIE #ec-02-section .with-bg .bg {
    z-index: 1;
}
.with-bg .bg-mask {
    overflow: hidden;
    height: 100%;
}
.with-bg .bg-mask .bg {
    position: absolute;
    left: 0;
    width: 100%;
}

@media screen and (min-width: 768px) {
    .with-bg + section {
        margin-top: -120px;
    }
    .with-bg + .section_inner {
        padding: 72px 0;
    }
    .isIE .with-bg svg.bg {
        min-height: 600px;
    }
}

@media screen and (min-width: 1366px) {
    .with-bg {
        height: 43.557833vw; /* 595 / 1366 * 100 */
    }
    .with-bg + section {
        margin-top: -8.784773vw; /* 120 / 1366 * 100 */
    }
    .with-bg + .with-bg {
        margin-top: -8.834773vw; /* 微調整 */
    }
    html.hasScrollbar .with-bg + section {
        margin-top: calc(-8.784773vw - 8px);
    }
    html.isWindows .with-bg + section {
        margin-top: -9.2vw;
    }
    .with-bg svg.bg,
    .with-bg .bg-mask {
        left: 0;
        width: 100%;
        margin-left: 0;
    }
    .with-bg .bg-mask .bg {
        top: -5vw;
    }
}

@media screen and (max-width: 1365px) {
    .with-bg .bg-mask .bg {
        top: -68px;
    }
}

@media screen and (max-width: 767px) {
    .with-bg {
        height: 52.269400vw; /* 595 / 1366 * 120 */
        height: 78.404100vw; /* 595 / 1366 * 180 */
    }
    .with-bg svg.bg,
    .with-bg .bg-mask {
        left: -40%;
        width: 180%;
        margin-left: 0;
    }
    .with-bg .bg-mask .bg {
        top: -7vw;
    }
    .section_title .ja {
        letter-spacing: .18em;
    }
    .section_lead {
        font-size: 2rem;
        letter-spacing: .15rem;
        font-weight: 700;
    }
}

/* :::::: with-bg title :::::: */

.with-bg .section_title {
    margin: 0;
}
.overview_title .num,
.with-bg .section_title .num {
    font-size: 3.2rem;
}
.overview_title .en,
.with-bg .section_title .en {
    margin-bottom: 15px;
    font-size: 1.1rem;
}
.overview_title .ja,
.with-bg .section_title .ja {
    font-size: 2.1rem;
}
.overview_title .en,
.overview_title .ja {
    color: #2c2d30;
}

@media screen and (min-width: 768px) {
    .with-bg .section_title {
        padding-top: 250px;
    }
}

@media screen and (min-width: 1366px) {
    .no-csstransforms .with-bg .section_title {
        padding-top: 18.301611vw; /* 250 / 1366 * 100 */
    }
    .csstransforms .with-bg .section_title {
        padding-top: 0;
        top: 50%;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
}

@media screen and (max-width: 767px) {
    .with-bg .section_title {
        padding-top: 0;
        top: 50%;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .with-bg .section_title .ja {
        font-size: 1.4rem;
    }
}

/* :::::: top-skew / btm-skew :::::: */

.top-skew,
.btm-skew {
    position: absolute;
    left: 50%;
    width: 100%;
    min-width: 1366px;
    margin-left: -683px;
}
.top-skew {
    top: -120px;
}
.btm-skew {
    bottom: -120px;
}

.with-bg .top-skew {
    top: -1px;
}
.with-bg .btm-skew,
.visual_mask .btm-skew {
    bottom: -1px;
}
.with-bg .top-skew,
.with-bg .btm-skew {
    left: 0;
    margin-left: 0;
    min-width: 0;
}

@media (max-width: 767px) {
    .visual_mask .btm-skew {
        left: -20%;
        margin-left: 0;
        min-width: 140%;
    }
    .bg-mask ~ .btm-skew,
    .bg-mask ~ .top-skew {
        left: -40%;
        min-width: 180%;
    }
}

.isIE .top-skew,
.isIE .btm-skew {
    width: 100vw;
    height: 122px;
}

@media screen and (min-width: 1366px) {
    .top-skew,
    .btm-skew {
        margin-left: -50%;
    }
    .top-skew {
        top: -8.784773vw; /* 120 / 1366 * 100 */
    }
    .btm-skew {
        bottom: -8.784773vw;
    }
    .isIE .top-skew,
    .isIE .btm-skew {
        height: 8.784773vw;
    }
}

/* :::::: hov-arr :::::: */

.hov-arr {
    display: none;
    position: absolute;
    overflow: hidden;
}
.hov-arr::after {
    content: "";
    display: block;
    background: #e52d27;
}
.hov-arr svg {
    fill: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22px;
    height: 16px;
}

.btn-panel .hov-arr {
    display: block;
    position: absolute;
    line-height: 1;
    text-align: center;
}

@media screen and (min-width: 768px) {
    .hov-arr,
    .hov-arr::after {
        display: block;
        height: 83px;
    }
    .hov-arr {
        display: block;
        bottom: 0;
        right: 0;
        width: 0;
        opacity: 0;
        transition: opacity .2s, width .2s
    }
    .hov-arr::after {
        width: 83px;
    }
    .hov-arr svg {
        margin: -8px 0 0 -10px;
        opacity: 0;
        transform: scaleX(0);
        transform-origin: 0 50%;
        transition: opacity .2s, transform .2s;
    }
    .no-touchevents a:hover .hov-arr {
        opacity: 1;
        width: 83px;
        transition-duration: .2s, .3s;
        transition-timing-function: ease, cubic-bezier(.1,.8,.35,1);
    }
    .no-touchevents a:hover .hov-arr svg {
        opacity: 1;
        transform: none;
        transition-delay: .2s, .3s;
        transition-timing-function: ease, cubic-bezier(.17,1.5,.5,1);
    }
}

@media screen and (max-width: 767px) {
    .hov-arr {
        top: calc(-20px - 8.784773vw);
        right: 0;
        width: 41px;
        height: 41px;
        padding: 13px 0;
        background: #b6b7ba;
    }
    .hov-arr svg {
        width: 11px;
        height: 8px;
        margin: -4px 0 0 -5px;
    }
    .no-touchevents a:hover .hov-arr {
        background: #e52d27;
    }
}

/* :::::: read-arr :::::: */

.read-arr {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 0;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    opacity: 0;
    background: #e52d27;
    transition: opacity .2s, width .2s;
}
.read-arr svg {
    fill: #fff;
    width: 11px;
    height: 8px;
    margin: -2px 0 0 .3em;
}
.read-arr_inner {
    display: block;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: opacity .2s, transform .2s;
}

@media (min-width: 768px) {
    .no-touchevents a[href]:hover .read-arr {
        width: 6em;
        opacity: 1;
        transition-duration: .2s, .3s;
        transition-timing-function: ease, cubic-bezier(.1,.8,.35,1);
    }
    .no-touchevents a[href]:hover .read-arr_inner {
        opacity: 1;
        transform: none;
        transition-delay: .3s;
        transition-timing-function: ease, cubic-bezier(.17,1.5,.5,1);
    }
}

/* :::::: card-list :::::: */

.career-category-section .card-list {
    width: 100%;
    margin-bottom:10px;
}

.card-item {
    float: left;
    padding: 0 16px;
}

.card-item a {
    display: block;
    position: relative;
}
.no-touchevents .card-item a[href]:hover {
    color: #a4a4a9;
}
.no-touchevents .card-item .card_visual::before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    bottom: 10%;
    left: 0;
    width: 100%;
    max-width: 230px;
    height: 0;
    margin: 0 auto;
    opacity: 0;
    border-radius: 10px 10px 0 0;
    background: rgba(230,45,39,.5);
    transition: height .2s, opacity .2s;
}
.no-touchevents .card-item a[href]:hover .card_visual::before {
    height: 90%;
    opacity: 1;
    transition-duration: .4s, .3s;
    transition-timing-function: ease, cubic-bezier(.1,.8,.35,1);
}
.card-item .read-arr {
    position: absolute;
    top: 34%;
    bottom: auto;
    padding: 0;
    background: none;
}
.touchevents .card-item .read-arr {
    display: none;
}
.card-item a[href]:hover .read-arr {
    width: 100%;
    transition-delay: 0s;
}
.card-item a[href]:hover .read-arr_inner {
    transition-duration: .3s;
}

.card_visual,
.card_caption {
    display: inline-block;
    max-width: 230px;
    margin: 0;
}

.card_visual {
    width: 100%;
    margin-bottom: 16px;
    padding: 48px 0 32px;
    border-radius: 10px;
    background: #fafafa;
    box-shadow: 2px 3px 6px rgba(0,0,0,.15),
                0 1px 3px rgba(255,255,255,.3) inset,
                1px 1px 6px rgba(255,255,255,.4) inset;
}
#policy-action-section .card_visual {
    padding-top: 56px;
}
#joblist-career-section .card_visual {
    padding: 0;
}
#policy-action-section .card_1 .card_visual,
#policy-action-section .card_3 .card_visual {
    -ms-transform: rotate(1deg);
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
}
#policy-action-section .card_2 .card_visual {
    -ms-transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    transform: rotate(-1deg);
}

.card_visual > img {
    width: 100%;
    border-radius: 10px 10px 0 0;
}

.card_visual .illust {
    line-height: 130px;
}

.card_cap {
    z-index: 1;
    position: relative;
    padding: 20px;
    border-radius: 0 0 10px 10px;
    font-size: 1.6rem;
    line-height: 1.2;
    text-align: left;
    background: #fff;
}

.card-item .card_lead {
    text-algin: center;
}
.card-item .card_lead span {
    display: block;
    color: #b6b7ba;
}
.card-item .card_lead .ja {
    margin: 10px 0 5px;
    color: #2c2d30;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.5;
}
.card-item .card_lead .en {
    font-size: 1.2rem;
    line-height: 1.2;
    letter-spacing: .05em;
}
.card-item .card_lead .num {
    font-size: 1.6rem;
}

.card_caption {
    font-size: 1.2rem;
    line-height: 1.5;
}

@media screen and (min-width: 768px) {
    #policy-action-section .card-list {
        width: 75%;
        margin: 0 auto;
    }
    .card-item {
        width: 25%;
    }
    .col2 .card-item {
        width: 50%;
    }
    .card-item:nth-child(4n+1) {
        clear: left;
    }
    #policy-action-section .card-item {
        width: 33.333333%;
    }
    #policy-action-section .card-item:nth-child(3n+1) {
        width: 33.333333%;
    }
}

@media screen and (max-width: 767px) {
    .card-item {
        width: 50%;
        margin-bottom: 20px;
    }
    .card-item:nth-child(2n+1) {
        clear: left;
    }
}

@media screen and (max-width: 480px) {
    .card-item {
        float: none;
        width: auto;
    }
    .career-category-section .card-list {
        width: calc(100% + 48px);
        margin: 0 -24px;
    }
    .career-category-section .card-item {
        float: left;
        width: 50%;
        padding: 0 8px;
    }
    .career-category-section .card_cap {
        font-size: 1.4rem;
    }
}

/* ==========================================================================
   Philosophy
   ========================================================================== */

[data-page="vision"] #main,
.philosophy-section {
    background: #f1f1f1;
}

.philosophy-section .section_title .en,
#philosophy-policy-section .section_title .en {
    margin-bottom: 8px;
    font-size: 3rem;
}

.philosophy-section .section_lead {
    margin-bottom: 32px;
}

.philosophy-section .txt {
    max-width: 600px;
    margin-right: auto;
    margin-left: auto;
}

.philosophy-section .obj img {
    position: absolute;
}

@media screen and (max-width: 1366px) {
    .philosophy-section .obj {
        pointer-events: none;
        position: absolute;
        top: 0;
        left: calc(50% - 683px);
        width: 1366px;
        height: 100%;
    }
}

@media screen and (max-width: 767px) {
    .philosophy-section .obj {
        display: none;
    }
}

/* :::::: Corporate Message :::::: */

#philosophy-message-section .obj_1 { top: 0; right: 0; }

/* :::::: Vision :::::: */

#philosophy-vision-section .obj_1 { top: -30%; left: 0; }

/* :::::: Management Guidelines :::::: */

#philosophy-guideline-section .card_1 .card_visual,
#philosophy-guideline-section .card_3 .card_visual {
    -ms-transform: rotate(1deg);
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
}
#philosophy-guideline-section .card_2 .card_visual,
#philosophy-guideline-section .card_4 .card_visual {
    -ms-transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    transform: rotate(-1deg);
}

#philosophy-guideline-section .obj_1 { top: -96%; right: 0; }
#philosophy-guideline-section .obj_2 { top: -34%; left: 0; }
#philosophy-guideline-section .obj_3 { bottom: -12%; left: 0; }

/* :::::: Corporate Policy :::::: */

#philosophy-policy-section,
#philosophy-policy-section .section_inner {
    background: #fff;
}

@media screen and (min-width: 768px) {
    .philosophy-section {
        padding: 64px 0 96px;
    }
    #philosophy-guideline-section {
        padding-bottom: 280px;
    }
    #philosophy-policy-section {
        padding: 32px 0 96px;
    }
    #philosophy-message-section .section_lead,
    #philosophy-policy-section .section_lead {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) {
    .philosophy-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    #philosophy-policy-section .section_inner {
        padding-top: 96px;
        padding-bottom: 64px;
    }
    #philosophy-guideline-section .section_inner {
        padding-bottom: 120px;
    }
    #philosophy-policy-section .section_inner {
        padding-top: 0;
    }
}

/* ==========================================================================
   Policy
   ========================================================================== */

[data-page="action"] #main,
.policy-section {
    background: #f1f1f1;
}

.policy-section .section_title .en {
    margin-bottom: 8px;
    font-size: 3rem;
}

.policy-section .txt {
    max-width: 600px;
    margin-right: auto;
    margin-left: auto;
}

.policy-section .obj img {
    position: absolute;
}

#policy-message-section {
    padding-top: 200px;
}

@media screen and (max-width: 1366px) {
    .policy-section .obj {
        pointer-events: none;
        position: absolute;
        top: 0;
        left: calc(50% - 683px);
        width: 1366px;
        height: 100%;
    }
}

@media screen and (max-width: 767px) {
    .policy-section .obj {
        display: none;
    }
}

/* :::::: Corporate Message :::::: */

#policy-message-section .obj_1 { top: 0; left: 0; }
#policy-message-section .obj_2 { top: 0; right: 0; }

/* :::::: Action :::::: */

#policy-action-section .obj_3 { top: 20%; left: 0; }
#policy-action-section .obj_4 { top: 0; right: 0; }
#policy-action-section .obj_5 { bottom: -29%; right: 0; }

/* :::::: Service :::::: */

#policy-service-section {
    z-index: 2;
    background: #fff;
}

@media screen and (min-width: 768px) {
    #policy-message-section {
        z-index: 1;
    }
    #policy-message-section,
    #policy-action-section {
        padding: 56px 0;
    }
    #policy-action-section {
        padding-bottom: 156px;
    }
    #policy-service-section {
        padding: 32px 0 96px;
    }
    #policy-message-section .section_lead {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) {
    .policy-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    #policy-action-section .section_inner {
        padding-bottom: 96px;
    }
    #policy-service-section .section_inner {
        padding-top: 0;
    }
}

/* ==========================================================================
   Overview
   ========================================================================== */

.intro-section > .section_inner > .txt {
    max-width: 712px;
    margin-right: auto;
    margin-left: auto;
}

.overview-section.with-bg {
    z-index: 1;
}
.overview-section.with-bg .section_inner {
    max-width: 960px;
}

@media screen and (min-width: 768px) {
    #overview-intro-section {
        padding: 70px 20px;
    }
    .overview-section.with-bg {
        padding-top: 140px;
        text-align: right;
    }
    #overview-spa-section {
        padding-top: 180px;
        text-align: left;
    }
}

@media screen and (min-width: 1366px) {
    .no-csstransforms .overview-section.with-bg {
        padding-top: 10.248902vw; /* 140 / 1024 * 100 */
    }
    .no-csstransforms #overview-spa-section {
        padding-top: 13.177160vw; /* 180 / 1366 * 100 */
    }
    .csstransforms .overview-section.with-bg {
        padding-top: 0;
    }
    .csstransforms .overview-section.with-bg .section_inner {
        top: 50%;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
    .csstransforms #overview-spa-section.with-bg .section_inner {
        top: 40%;
    }
    .isIE9.csstransforms #overview-ec-section.with-bg .section_inner,
    .isIE9.csstransforms #overview-web-section.with-bg .section_inner {
        margin-right: 80px;
    }
}

@media screen and (max-width: 767px) {
    #overview-intro-section .section_inner {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .overview-section.with-bg {
        height: auto;
    }
    .overview-section.with-bg .bg {
        position: relative;
    }
    .isIE .overview-section.with-bg .bg {
        height: 52.269400vw; /* 595 / 1366 * 120 */
        height: 78.404100vw; /* 595 / 1366 * 180 */
    }
    .overview-section.with-bg .section_inner {
        padding: 10px 40px;
    }
}

/* :::::: btn-panel :::::: */

.btn-panel {
    display: inline-block;
}
.btn-panel a {
    display: block;
    width: 100%;
}

.btn-panel .section_lead {
    font-size: 1.9rem;
    line-height: 1.4;
}
.btn-panel .section_lead span {
    display: block;
    color: #b6b6ba;
}
.btn-panel .section_lead .num {
    font-size: 2.5rem;
}
.btn-panel .section_lead .ja {
    margin-bottom: 5px;
    color: #2c2d30;
}
.btn-panel .section_lead .en {
    font-size: 1.4rem;
    letter-spacing: .1em;
}

.btn-panel .txt {
    margin-bottom: 0;
    font-size: 1.2rem;
    line-height: 1.9;
}

@media screen and (min-width: 768px) {
    .btn-panel a {
        position: relative;
        overflow: hidden;
        max-width: 464px;
        padding: 50px 120px 50px 50px;
        text-align: left;
        background: #fff;
    }
    .btn-panel .section_lead .num {
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 767px) {
    .section_lead br {
        display: none;
    }
    .section_lead br.sp-only {
        display: block;
    }
    .btn-panel .section_lead .num {
        margin-bottom: 5px;
    }
}

/* :::::: outline-section :::::: */

#overview-outline-section {
    overflow: hidden;
    /*background: url(../img/overview_visual_04.jpg) center center / cover no-repeat;*/
}
#overview-outline-section .bg {
    position: absolute;
    top: -10%;
    left: 0;
    width: 100%;
}

#overview-outline-section .section_title .ja {
    color: #2c2d30;
    font-size: 1.9rem;
}
#overview-outline-section .section_title .en {
    font-size: 1.4rem;
    letter-spacing: .05em;
}

@media screen and (min-width: 768px) {
    #overview-outline-section {
        padding: 152px 0 96px;
    }
}

@media screen and (min-width: 1366px) {
    #overview-outline-section {
        padding: 10.980966vw 0 7.320644vw;
    }
}

@media screen and (max-width: 767px) {
    #overview-web-section > .btm-skew {
        top: 100%;
    }
    #overview-outline-section .section_inner {
        padding-top: 96px;
        padding-bottom: 64px;
    }
    #overview-outline-section .bg {
        top: 0;
        left: 50%;
        width: auto;
        height: 100%;
        max-width: none;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }
}

/* :::::: btn-panel-list :::::: */

.btn-panel-list {
    max-width: 960px;
}
.btn-panel-item {
    position: relative;
}
.btn-panel-item a {
    display: block;
    background: #fff;
    transition: .2s linear;
    -webkit-transition: .2s linear;
    -moz-transition: .2s linear;
    -o-transition: .2s linear;
    -ms-transition: .2s linear;

}
.btn-panel-item a:hover {
    background: #f9f9f9;
}
.btn-panel_figure .ja {
    display: block;
    font-size: 1.5rem;
    letter-spacing: 0;
}
.btn-panel_figure .en {
    color: #b6b7ba;
    font-size: 1.1rem;
    letter-spacing: .05em;
}

@media screen and (min-width: 768px) {
    .no-touchevents .btn-panel-item a[href]:hover .ja,
    .no-touchevents .btn-panel-item a[href]:hover .en {
        color: #e52d27;
    }
}

@media screen and (min-width: 768px) {
    .btn-panel-list {
        margin: 0 auto;
    }
    .btn-panel-item {
        text-align: left;
    }
    .btn-panel-item a {
        padding: 50px 60px;
    }
    .btn-panel_figure {
        padding-left: 50px;
        line-height: 1.4;
    }
    .btn-panel_figure img {
        position: absolute;
        top: 50%;
        left: 70px;
        -ms-transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }
}

@media screen and (max-width: 767px) {
    .btn-panel-item {
        float: left;
        width: 50%;
    }
    .btn-panel-item:nth-child(2n+1) {
        clear: left;
    }
    .btn-panel-item a {
        padding: 20px 0;
    }
    .btn-panel_figure {
        line-height: 1.2;
    }
    .btn-panel_figure img {
        margin-bottom: 5px;
    }
}

@media screen and (max-width: 374px) {
    .btn-panel_figure .ja {
        font-size: 1.3rem;
    }
    .btn-panel_figure .en {
        font-size: 1rem;
    }
}

/* :::::: relation-section :::::: */

#relation-section {
    background: #dcdddf;
}
#relation-section .section_inner {
    max-width: 960px;
}

@media screen and (min-width: 768px) {
    #relation-section {
        padding: 160px 0 120px;
    }
}

@media screen and (max-width: 767px) {
    #relation-section .section_inner {
        padding-top: 100px;
        padding-bottom: 60px;
    }
}

/* ==========================================================================
   Overview Appear animation
   ========================================================================== */

@media screen and (min-width: 1024px) {
    .intro-section [data-appeared] .section_lead,
    .intro-section [data-appeared] .txt,
    .with-bg [data-appeared] .btn-panel,
    .with-bg [data-appeared] .num,
    .with-bg [data-appeared] .ja,
    .with-bg [data-appeared] .en,
    .with-bg [data-appeared] .txt,
    [data-appeared] .btn-panel-item,
    [data-appeared] .section_title .ja,
    [data-appeared] .section_title .en,
    [data-appeared] .relation-item,
    [data-appeared] .relation_title .ja,
    [data-appeared] .relation_title .en,
    [data-appeared] .relation_figure .txt,
    [data-appeared] .relation_figure img {
        transition-property: opacity, transform;
    }
    .intro-section [data-appeared="false"] .section_lead,
    .intro-section [data-appeared="false"] .txt,
    .with-bg [data-appeared="false"] .btn-panel,
    .with-bg [data-appeared="false"] .num,
    .with-bg [data-appeared="false"] .ja,
    .with-bg [data-appeared="false"] .en,
    .with-bg [data-appeared="false"] .txt,
    [data-appeared="false"] .btn-panel-item,
    [data-appeared="false"] .section_title .en,
    [data-appeared="false"] .section_title .ja,
    [data-appeared="false"] .relation-item,
    [data-appeared="false"] .relation_title .ja,
    [data-appeared="false"] .relation_title .en,
    [data-appeared="false"] .relation_figure .txt,
    [data-appeared="false"] .relation_figure img {
        opacity: 0;
        transform: translateY(50px);
        transition-duration: .2s;
    }
    [data-appeared="false"] .btn-panel-item {
        transform: scale(0);
    }
    .intro-section [data-appeared="true"] .section_lead,
    .intro-section [data-appeared="true"] .txt,
    .with-bg [data-appeared="true"] .btn-panel,
    .with-bg [data-appeared="true"] .num,
    .with-bg [data-appeared="true"] .ja,
    .with-bg [data-appeared="true"] .en,
    .with-bg [data-appeared="true"] .txt,
    [data-appeared="true"] .btn-panel-item,
    [data-appeared="true"] .section_title .en,
    [data-appeared="true"] .section_title .ja,
    [data-appeared="true"] .relation-item,
    [data-appeared="true"] .relation_title .ja,
    [data-appeared="true"] .relation_title .en,
    [data-appeared="true"] .relation_figure .txt,
    [data-appeared="true"] .relation_figure img {
        opacity: 1;
        transform: none;
        transition-duration: .4s, .6s;
        transition-timing-function: ease, cubic-bezier(.1,.8,.35,1);
    }
    [data-appeared="true"] .btn-panel-item {
        transition-timing-function: ease, cubic-bezier(.15,1.36,.5,1);
    }
    
    .intro-section [data-appeared="true"] .section_lead,
    .with-bg [data-appeared="true"] .btn-panel,
    [data-appeared="true"] .section_title .en { transition-delay: .1s; }
    .intro-section [data-appeared="true"] .txt,
    [data-appeared="true"] .section_title .ja { transition-delay: .2s; }
    .with-bg [data-appeared="true"] .num { transition-delay: .3s; }
    .with-bg [data-appeared="true"] .ja { transition-delay: .4s; }
    .with-bg [data-appeared="true"] .en { transition-delay: .5s; }
    .with-bg [data-appeared="true"] .txt { transition-delay: .6s; }
    
    #overview-outline-section [data-appeared="true"] .section_title { transition-delay: .6s; }
    
    [data-appeared="true"] .btn-panel-item:nth-child(1) { transition-delay: .1s; }
    [data-appeared="true"] .btn-panel-item:nth-child(2) { transition-delay: .2s; }
    [data-appeared="true"] .btn-panel-item:nth-child(3) { transition-delay: .3s; }
    [data-appeared="true"] .btn-panel-item:nth-child(4) { transition-delay: .4s; }
    [data-appeared="true"] .btn-panel-item:nth-child(5) { transition-delay: .5s; }
    [data-appeared="true"] .btn-panel-item:nth-child(6) { transition-delay: .6s; }
    
    [data-appeared="true"] .relation-item:nth-child(1) .relation_title .ja   { transition-delay: .1s; }
    [data-appeared="true"] .relation-item:nth-child(1) .relation_title .en   { transition-delay: .2s; }
    [data-appeared="true"] .relation-item:nth-child(1) .relation_figure .txt { transition-delay: .3s; }
    [data-appeared="true"] .relation-item:nth-child(1) .relation_figure img  { transition-delay: .4s; }
    [data-appeared="true"] .relation-item:nth-child(2) .relation_title .ja   { transition-delay: .2s; }
    [data-appeared="true"] .relation-item:nth-child(2) .relation_title .en   { transition-delay: .3s; }
    [data-appeared="true"] .relation-item:nth-child(2) .relation_figure .txt { transition-delay: .4s; }
    [data-appeared="true"] .relation-item:nth-child(2) .relation_figure img  { transition-delay: .5s; }
    [data-appeared="true"] .relation-item:nth-child(3) .relation_title .ja   { transition-delay: .3s; }
    [data-appeared="true"] .relation-item:nth-child(3) .relation_title .en   { transition-delay: .4s; }
    [data-appeared="true"] .relation-item:nth-child(3) .relation_figure .txt { transition-delay: .5s; }
    [data-appeared="true"] .relation-item:nth-child(3) .relation_figure img  { transition-delay: .6s; }
    
    [data-appeared="true"] .relation-item:nth-child(1) { transition-delay: .1s; }
    [data-appeared="true"] .relation-item:nth-child(2) { transition-delay: .2s; }
    [data-appeared="true"] .relation-item:nth-child(3) { transition-delay: .3s; }
}

/* ==========================================================================
   EC business
   ========================================================================== */

[data-page="ec"] .visual_title,
[data-page="ec"] .visual_lead {
    color: #fff;
}

.ec-section {
    z-index: 2;
}

.ec-section .section_inner {
    max-width: 960px;
}

.ec-section .section_lead {
    font-size: 1.6rem;
}

#ec-intro-section .txt {
    max-width: 712px;
    margin-right: auto;
    margin-left: auto;
}

@media screen and (min-width: 768px) {
    [data-page="ec"] #visual {
        padding-top: 320px;
    }
    #ec-intro-section {
        padding: 72px 0;
    }
    .ec-section .section_lead,
    #ec-intro-section .txt {
        margin-bottom: 40px;
    }
    #ec-intro-section a.btn {
        min-width: 320px;
    }
}

@media screen and (min-width: 1366px) {
    [data-page="ec"] #visual {
        padding-top: 23.426061vw; /* 320 / 1366 * 100 */
    }
}

@media screen and (max-width: 767px) {
    #ec-intro-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    [data-page="ec"] .section_lead,
    #ec-intro-section .txt {
        margin-bottom: 24px;
    }
    #ec-02-section {
        z-index: 1;
    }
    #ec-02-section .section_inner .col2 .caption {
        margin-top: .5em;
        text-align: center;
    }
}

/* :::::: column-layout :::::: */

.column-layout .txt {
    margin: 0;
}

.column-layout .title {
    margin-top: 0;
}

.column-layout .btn {
    margin-top: 32px;
    font-size: 1.2rem;
}

@media screen and (min-width: 768px) {
    .column-layout > :first-child {
        padding-right: 48px;
        border-right: 1px solid #e7e7e7;
    }
    #ec-02-section .col2 + .col2 {
        padding-left: 48px;
    }
}

@media screen and (max-width: 767px) {
    .column-layout > :first-child {
        padding-bottom: 32px;
        border-bottom: 1px solid #e7e7e7;
    }
    .column-layout .col2 + .col2 {
        padding-top: 32px;
    }
    .column-layout .btn {
        width: 100%;
    }
    #ec-02-section .section_inner .col2 .caption{
    margin-top:10px;
    text-align:center;
    }
}

/* :::::: shop-info :::::: */

.shop-info {
    margin: 0;
}

.shop_title {
    margin-bottom: 24px;
    letter-spacing: .05em;
}
.shop_thumb {
    display: inline-block;
    width: 110px;
    margin-right: 1em;
}

.shop_detail {
    color: #616266;
    font-size: 1.2rem;
    line-height: 1.9;
}

@media screen and (max-width: 767px) {
    .shop_thumb,
    .shop_name {
        display: block;
    }
    .shop_thumb {
        margin-bottom: 24px;
    }
    .shop_thumb,
    .shop_thumb img {
        width: 100%;
    }
}

/* ==========================================================================
   SPA business
   ========================================================================== */

[data-page="spa"] .visual_title,
[data-page="spa"] .visual_lead {
    color: #fff;
}

#spa-intro-section .txt {
    max-width: 712px;
    margin-right: auto;
    margin-left: auto;
}

.spa-section {
    z-index: 2;
}
#spa-02-section,
#spa-03-section {
    padding-bottom: 120px;
}

.spa-lineup-section {
    padding-bottom: 100px;
    background: #dcdddf;
}
.spa-lineup-section + section {
    margin-top: -40px;
}

.spa-section .section_inner,
.spa-lineup-section .section_inner {
    max-width: 960px;
}
.spa-section .section_lead {
    font-size: 1.6rem;
}

.spa-section .txt {
    max-width: 712px;
    margin-right: auto;
    margin-left: auto;
}
#spa-03-lineup-section .txt {
    max-width: 450px;
    margin-right: auto;
    margin-left: auto;
}

.spa-section .txt .note {
    margin-top: .5em;
}

@media screen and (min-width: 768px) {
    #spa-intro-section {
        padding: 72px 0;
    }
    [data-page="spa"] .section_lead,
    #spa-intro-section .txt {
        margin-bottom: 40px;
    }
}

@media screen and (max-width: 767px) {
    #spa-intro-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

/* :::::: lineup-list :::::: */

.lineup-list {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 32px 0;
}
.lineup-list .lineup-item {
    padding: 0 16px;
}

@media screen and (min-width: 481px) {
    .lineup-list .lineup-item {
        -webkit-flex: 1 1 50%;
        flex: 1 1 50%;
        max-width: 50%;
    }
    html.no-flexbox .lineup-list .lineup-item {
        float: left;
        width: 50%;
    }
}

@media screen and (max-width: 480px) {
    .lineup-list {
        display: block;
    }
}

.lineup_caption {
    margin: 0;
}

.lineup_name {
    margin-bottom: .6em;
    font-size: 1.6rem;
    line-height: 1.4;
}
.lineup_detail {
    font-size: 1.2rem;
    line-height: 1.8;
}

#spa-02-lineup-section .btn,
#spa-03-lineup-section .btn {
    border-color: #bdc0c5;
    font-size: 1.2rem;
}

/* ==========================================================================
   WEB service
   ========================================================================== */

[data-page="web"] .visual_title,
[data-page="web"] .visual_lead {
    color: #fff;
}

#web-01-section {
    z-index: 2;
}

[data-page="web"] .section_inner {
    max-width: 960px;
}

#web-01-section .section_lead {
    font-size: 1.6rem;
}

#web-intro-section .txt,
.web-section .txt {
    max-width: 712px;
    margin-right: auto;
    margin-left: auto;
}

@media screen and (min-width: 768px) {
    #web-intro-section {
        padding: 72px 0;
    }
    [data-page="web"] .section_lead {
        margin-bottom: 40px;
    }
    #web-01-section .txt {
        margin-bottom: 32px;
    }
}

@media screen and (max-width: 767px) {
    #web-intro-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

/* ==========================================================================
   Company
   ========================================================================== */

.company-section {
    z-index: 2;
}

#company-intro-section .section_inner {
    max-width: 640px;
}

#company-logistics-section .section_inner {
    max-width: 960px;
}
#company-logistics-section .section_inner > .txt {
    max-width: 700px;
    margin-right: auto;
    margin-left: auto;
}
#company-logistics-section .photo-list {
    text-align: left;
}
#company-logistics-section .photo_caption {
    margin-top: 8px;
}

#company-retail-section .section_inner > .txt {
    max-width: 700px;
    margin-right: auto;
    margin-left: auto;
}
#company-retail-section .section_inner > .btn {
    width: 100%;
    max-width: 450px;
    margin: 0 auto;
}

@media screen and (min-width: 481px) {
    #company-logistics-section .col-l {
        float: left;
        width: 50%;
        padding-right: 8px;
    }
    #company-logistics-section .col-r {
        float: right;
        width: 50%;
        padding-left: 8px;
    }
}

@media screen and (min-width: 768px) {
    .company-section {
        padding: 56px 0;
    }
    #company-history-section .section_inner > .txt,
    #company-logistics-section .section_inner > .txt,
    #company-retail-section .section_inner > .txt,
    #company-retail-section .section_inner > .btn {
        margin-bottom: 56px;
    }
    #company-logistics-section .section_inner > img,
    #company-retail-section .section_inner > img {
        margin-bottom: 32px;
    }
    #company-logistics-section .col-l {
        padding-right: 16px;
    }
    #company-logistics-section .col-r {
        padding-left: 16px;
    }
    #company-logistics-section .photo_caption {
        font-size: 1.5rem;
    }
    #company-retail-section .section_inner > .section_lead {
        margin-bottom: 32px;
    }
}

@media screen and (max-width: 767px) {
    .company-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    #company-history-section .section_inner > .txt,
    #company-logistics-section .section_inner > .txt,
    #company-retail-section .section_inner > .txt,
    #company-retail-section .section_inner > .btn {
        margin-bottom: 32px;
    }
    #company-logistics-section .section_inner > img {
        margin-bottom: 16px;
    }
}

@media screen and (max-width: 480px) {
    #company-logistics-section .section_inner .photo-item {
        margin-bottom: 16px;
    }
}

/* :::::: contents-tab-list :::::: */

.tab-section {
    z-index: 1;
    position: relative;
    padding: 32px 0 16px;
}

.tab-item {
    position: relative;
}

.tab-item a {
    display: block;
}

@media screen and (min-width: 481px) {
    .tab-list {
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        justify-content: center;
    }
    html.no-flexbox .tab-list {
        display: inline-block;
        position: relative;
        left: 50%;
        margin-right: 0;
        margin-left: 0;
        -ms-transform: translateX(-50%);
    }
    
    .tab-item {
        position: relative;
        margin-left: -1px;
        border-right: 1px solid #e3e4e6;
        border-left: 1px solid #e3e4e6;
    }
    html.no-flexbox .tab-item {
        float: left;
        margin-left: -1px;
    }
    
    .tab-item a {
        padding: 0 1.5em;
    }
    
    .tab-item a::after {
        content: "";
        display: block;
        position: absolute;
        right: 2em;
        bottom: -1em;
        left: 2em;
        height: 0;
        background: #e52d27;
        transition: height .2s cubic-bezier(.1,.8,.35,1);
        will-change: height;
    }
    .tab-item:hover a::after,
    [data-page="company"] .tab-item.tab_1 a::after,
    [data-page="greeting"] .tab-item.tab_2 a::after,
    [data-page="performance"] .tab-item.tab_3 a::after,
    [data-page="csr"] .tab-item.tab_4 a::after {
        height: 6px;
    }
}

@media screen and (min-width: 768px) {
    .tab-list {
        margin: 24px 24px 48px;
    }
    .tab-item a {
        padding: 0 2em;
    }
}

@media screen and (max-width: 767px) {
    .tab-list {
        margin: 32px 24px 24px;
    }
}

@media screen and (max-width: 480px) {
    .tab-item {
        margin-top: -1px;
        border-top: 1px solid #e3e4e6;
        border-bottom: 1px solid #e3e4e6;
    }
    .tab-item a {
        padding: 1em;
    }
    [data-page="company"] .tab-item.tab_1 a,
    [data-page="greeting"] .tab-item.tab_2 a,
    [data-page="performance"] .tab-item.tab_3 a,
    [data-page="csr"] .tab-item.tab_4 a {
        pointer-events: none;
        color: #e52d27;
        background: #f7f7f7;
    }
    [data-page="greeting"] .tab-item.tab_2 a {
        background: rgba(255,255,255,.5);
    }
}

/* :::::: company-info-table :::::: */

.company-info-table {
    width: 100%;
    text-align: left;
}

.company-info-table tr {
    border-top: 1px dotted #e3e3e3;
    border-bottom: 1px dotted #e3e3e3;
}
.company-info-table th,
.company-info-table td {
    font-weight: 300;
}
.company-info-table th {
    background: #f7f7f7;
}
.company-info-table td {
    background: #fff;
    letter-spacing: .05em;
}

@media screen and (min-width: 768px) {
    .company-info-table-wrap {
        max-width: 850px;
        margin: 0 auto;
    }
    .company-info-table th,
    .company-info-table td {
        padding: 1.5em 2.5em;
    }
    .company-info-table th {
        min-width: 15em;
    }
}

@media screen and (max-width: 767px) {
    .company-info-table th,
    .company-info-table td {
        display: block;
        padding: 1em 1.5em;
    }
    .company-info-table th {
        min-width: 8em;
    }
}

/* :::::: history-list :::::: */

.history-list {
    max-width: 700px;
    margin: 0 auto;
    text-align: left;
}

.history-list dt {
    padding-top: 1em;
    color: #b6b7ba;
}
.history-list dd {
    padding-bottom: 1em;
    border-bottom: 1px dotted #e3e3e3;
    letter-spacing: .05em;
}

@media screen and (min-width: 768px) {
    .history-list > * {
        line-height: 1.9;
    }
    .history-list dt {
        min-width: 12em;
    }
    .history-list dd {
        margin-top: -1.9em;
        padding-left: 12em;
    }
}

@media screen and (max-width: 767px) {
    .history-list > * {
        line-height: 1.33068562;
    }
    .history-list dt {
        min-width: 7em;
    }
    .history-list dd {
        margin-top: -1.33068562em;
        padding-left: 7em;
    }
}

/* :::::: photo-info-list :::::: */

.photo-info-list {
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
}

.photo-info-item {
    width: 100%;
    border-bottom: 1px solid #dcdddf;
}
.photo-info-item:first-child {
    border-top: 1px solid #dcdddf;
}

.photo-info-item .info_wrap {
    margin: 0;
}
.photo-info-item .info_title {
    color: #2c2d30;
    font-size: 1.6rem;
    font-weight: 400;
}
.photo-info-item .info_date,
.photo-info-item .info_detail {
    color: #616266;
    font-size: 1.2rem;
}
#company-retail-section .info_detail {
    font-size: 1.2rem;
}

.info_detail .detail_table dt {
    padding-top: .3em;
}
.info_detail .detail_table dd {
    margin-top: -1.5em;
    padding-bottom: .3em;
    padding-left: 6em;
}

.info_detail .btn {
    width: 100%;
    max-width: 320px;
    margin-top: 1em;
}

@media screen and (min-width: 768px) {
    .photo-info-list {
        text-align: left;
    }
    .photo-info-item {
        display: table;
        padding: 40px;
    }
    .photo-info-item > * {
        display: table-cell;
        width: 50%;
        vertical-align: middle;
    }
    .photo-info-item .info_title {
        margin-bottom: 20px;
        line-height: 1.4;
    }
    .photo-info-item .info_detail {
        line-height: 1.6;
    }
    .info_detail .detail_table > * {
        line-height: 1.5;
    }
}

@media screen and (max-width: 767px) {
    .photo-info-item {
        padding: 20px;
    }
    .photo-info-item .info_wrap {
        max-width: 360px;
        margin: 0 auto;
        padding-top: 20px;
        text-align: left;
    }
    .photo-info-item .info_title {
        margin-bottom: 10px;
    }
    .photo-info-item .info_detail,
    .info_detail .detail_table > * {
        line-height: 1.33068562;
    }
}

/* ==========================================================================
   Greeting
   ========================================================================== */

[data-page="greeting"] #main {
    background: #f0f1f3;
}

[data-page="greeting"] .visual_title {
    color: #2c2d30;
}

#greeting-section .tab-list {
    z-index: 1;
    position: relative;
}

#greeting-section .section_copy {
    color: #2c2d30;
    line-height: 1.8;
    text-align: center;
}
#greeting-section .section_copy .en,
#greeting-section .section_copy .ja {
    display: block;
    letter-spacing: .3rem;
}
#greeting-section .section_copy .en {
    font-size: 6rem;
    font-weight: 700;
}
#greeting-section .section_copy .ja {
    font-size: 2.3rem;
}

#greeting-section .section_title,
#greeting-section .txt {
    text-align: left;
}
#greeting-section .section_title {
    margin-bottom: 32px;
    color: #2c2d30;
    line-height: 1.8;
}

.signature {
    text-align: right;
}
.signature img {
    width: 130px;
}

[data-page="greeting"] #relation-section {
    z-index: 1;
}

@media screen and (min-width: 768px) {
    #greeting-section {
        padding: 32px 0 208px;
    }
    #greeting-section .section_copy {
        margin-bottom: 96px;
    }
    #greeting-section .section_title,
    #greeting-section .txt {
        position: relative;
        max-width: 960px;
        padding-left: 416px;
        text-align: left;
    }
    #greeting-section .section_title {
        letter-spacing: .25em;
    }
    #greeting-section .txt {
        line-height: 2;
    }
    .signature {
        max-width: 900px;
        margin: 0 auto;
    }
    #greeting-section .bg {
        position: absolute;
        bottom: 0;
        left: 50%;
        width: 1366px;
        max-width: none;
        -ms-transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    [data-page="greeting"] #relation-section {
        padding: 40px 0 120px;
    }
}

@media screen and (max-width: 767px) {
    #greeting-section .section_inner {
        padding-top: 32px;
        padding-bottom: 96px;
    }
    #greeting-section {
        padding-bottom: 64px;
    }
    #greeting-section .main-img {
        margin-bottom: 32px;
    }
    [data-page="greeting"] #relation-section .section_inner {
        padding-top: 0;
    }
    #greeting-section .section_copy {
        margin-bottom: 32px;
    }
    #greeting-section .section_copy .en {
        margin-bottom: .3em;
        font-size: 5rem;
        line-height: 1.1;
    }
    #greeting-section .section_copy .ja {
        font-size: 2rem;
    }
}

@media screen and (max-width: 480px) {
    #greeting-section .main-img {
        margin: 0 -32px 32px;
    }
}

/* ==========================================================================
   Performance
   ========================================================================== */

.performance_section {
    z-index: 2;
}

.performance_section .section_title {
    margin-bottom: 32px;
    color: #2c2d30;
    line-height: 1.8;
}

.performance_section .txt {
    max-width: 712px;
    margin: 1em auto 40px;
}

@media (min-width: 768px) {
    .performance_section {
        padding: 56px 0;
    }
}

@media (max-width: 767px) {
    .performance_section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
}

/* :::::: performance-graph :::::: */

.performance-graph,
.graph-list,
.graph_scale {
    position: relative;
}
.performance-graph {
    max-width: 856px;
    margin: 0 auto;
    margin-bottom: 1.6em !important;
}

.graph-list {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    margin: 0;
}
.graph_year {
    position: absolute;
    color: #e52d27;
}

.graph_bar {
    position: relative;
}

.graph_bar::after {
    content: "";
    display: block;
    position: absolute;
    border: 1px solid #000;
    background: #fff;
}
.g3::after { background: #656766; }
.g4::after { background: #d8d8d8; }
.g5::after {
    background: #f5cccb url(../img/performance_graph.png);
    background-size: 3px 3px;
}

.graph_scale .border {
    position: absolute;
    top: 0;
    width: 0;
}
.graph_scale .border::after {
    content: attr(data-stop);
    display: block;
    position: absolute;
    white-space: nowrap;
}

.graph_note {
    margin-top: 32px;
}

@media (min-width: 481px) {
    .performance-graph,
    .graph-list,
    .graph_scale {
        height: 200px;
    }
    .graph_year {
        right: 100%;
        padding-right: 1em;
    }
    .y1 { top: 2%; }
    .y2 { top: 22%; }
    .y3 { top: 42%; }
    .y4 { top: 62%; }
    .y5 { top: 82%; }
    
    .graph_bar { height: 20%; }
    .cssanimations .graph_bar { width: 0; }
    .cssanimations .g1 { width: 10%; }
    .cssanimations .g2 { width: 20%; }
    .cssanimations .g3 { width: 50%; }
    .cssanimations .g4 { width: 74%; }
    .cssanimations .g5 { width: 88%; }
    .graph_bar::after {
        top: 8px;
        bottom: 8px;
        left: 0;
        width: 100%;
    }
    
    .graph_scale .border {
        padding-top: 200px;
        border-left: 1px dashed #ccc;
    }
    .graph_scale .b1 { left: 0; }
    .graph_scale .b2 { left: 10%; }
    .graph_scale .b3 { left: 20%; }
    .graph_scale .b4 { left: 30%; }
    .graph_scale .b5 { left: 40%; }
    .graph_scale .b6 { left: 50%; }
    .graph_scale .b7 { left: 60%; }
    .graph_scale .b8 { left: 70%; }
    .graph_scale .b9 { left: 80%; }
    .graph_scale .b10 { left: 90%; }
    .graph_scale .b11 { left: 100%; }
    .graph_scale .border::after {
        top: 100%;
        transform: translateX(-50%);
    }
}

@media (max-width: 767px) {
    .performance-graph {
        margin-left: 48px;
    }
}

@media (max-width: 480px) {
    .performance-graph,
    .graph-list,
    .graph_scale {
        height: 368px;
    }
    .graph_year {
        bottom: -2em;
        transform: translateX(-50%);
    }
    .y1 { left: 10%; }
    .y2 { left: 30%; }
    .y3 { left: 50%; }
    .y4 { left: 70%; }
    .y5 { left: 90%; }
    
    .graph_bar {
        display: block;
        position: absolute;
        bottom: 0;
        width: 20%;
    }
    .cssanimations .graph_bar { height: 0; }
    .cssanimations .g1 { left: 0; height: 10%; }
    .cssanimations .g2 { left: 20%; height: 20%; }
    .cssanimations .g3 { left: 40%; height: 50%; }
    .cssanimations .g4 { left: 60%; height: 74%; }
    .cssanimations .g5 { left: 80%; height: 88%; }
    .graph_bar::after {
        right: 8px;
        bottom: 0;
        left: 8px;
        max-width: 32px;
        height: 100%;
        margin: 0 auto;
    }
    
    .graph_scale .border {
        top: auto;
        width: 100%;
        border-top: 1px dashed #ccc;
    }
    .graph_scale .b1 { bottom: 0; }
    .graph_scale .b2 { bottom: 10%; }
    .graph_scale .b3 { bottom: 20%; }
    .graph_scale .b4 { bottom: 30%; }
    .graph_scale .b5 { bottom: 40%; }
    .graph_scale .b6 { bottom: 50%; }
    .graph_scale .b7 { bottom: 60%; }
    .graph_scale .b8 { bottom: 70%; }
    .graph_scale .b9 { bottom: 80%; }
    .graph_scale .b10 { bottom: 90%; }
    .graph_scale .b11 { bottom: 100%; }
    .graph_scale .border::after {
        right: 100%;
        padding-right: 1em;
        margin-top: -.7em;
    }
}

.graph_scale .b1,
.graph_scale .b11 {
    border-color: #000;
}

/* :::::: performance-awards :::::: */

.performance-awards {
    max-width: 800px;
    margin: 0 auto;
}

.awards-list {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: -40px;
}
html.no-flexbox .awards-list::after {
    content: "";
    display: block;
    clear: left;
}

.awards-item {
    margin-bottom: 40px;
}
.no-flexbox .awards-item {
    float: left;
}

.awards img,
.logistics img {
    border-radius: 50%;
    border: 8px solid #fff;
    box-shadow: 0 0 0 1px #bbb;
    box-sizing: content-box;
}
.awards img {
    margin-bottom: 8px;
}

.awards-item .year {
    color: #e52d27;
}
.awards_caption {
    padding: 0 .5em;
    line-height: 1.4;
}
.awards_caption .note {
    display: inline-block;
    bottom: 0;
}

@media (min-width: 481px) {
    .awards-item {
        -webkit-flex: 1 1 25%;
        flex: 1 1 25%;
        max-width: 25%;
    }
    .no-flexbox .awards-item {
        width: 25%;
    }
    .no-flexbox .awards-item:nth-child(4n + 1) {
        clear: left;
    }
    .awards img {
        width: 100%;
        max-width: 157px;
    }
    .awards_caption {
        font-size:0.8em;
    }
}

@media (max-width: 767px) {
    .awards-list {
        margin-right: -8px;
        margin-left: -8px;
    }
    .awards-item {
        padding: 0 8px;
    }
    .awards img {
        box-sizing: border-box;
    }
    .awards-item .year {
        margin-bottom: .3em;
    }
}

@media (max-width: 480px) {
    .awards-list {
        margin-bottom: -20px;
    }
    .awards-item {
        -webkit-flex: 1 1 50%;
        flex: 1 1 50%;
        max-width: 50%;
        margin-bottom: 20px;
    }
    .no-flexbox .awards-item {
        width: 50%;
    }
    .no-flexbox .awards-item:nth-child(2n + 1) {
        clear: left;
    }
    .awards img {
        width: 100%;
        max-width: 157px;
        border: 8px solid #fff;
        box-sizing: border-box;
    }
}

/* :::::: client-diagram :::::: */

.client-diagram {
    position: relative;
    width: 712px;
    height: 560px;
    margin: 0 auto;
}

.diagram_section {
    position: absolute;
}
.diagram1 { bottom: 60px; left: 60px; }
.diagram2 { top: 80px; left: 72px; }
.diagram3 { top: 40px; right: 56px; }
.diagram4 { bottom: 72px; right: 50px; }

.diagram_review,
.diagram-item {
    position: absolute;
    border: 2px solid #656766;
    border-radius: 50%;
    background: #fff;
}

.diagram-item {
    line-height: 1;
}
.diagram-item.s1 { width: 128px; height: 128px; padding: 12px 0 24px; }
.diagram-item.s2 { width: 120px; height: 120px; padding: 12px 0 20px; }
.diagram-item.s3 { width: 104px; height: 104px; padding: 12px 0 18px; }
.diagram-item.s4 { width: 80px; height: 80px; padding: 10px 0 14px; }
.diagram-item.s5 { width: 64px; height: 64px; padding: 8px 0 12px; }
.diagram-item img {
    width: auto;
    max-height: 100%;
}
.diagram1 .d1 { bottom: -60px; left: -60px; }
.diagram1 .d2 { top: -40px; left: 80px; }
.diagram1 .d3 { bottom: 0; right: -32px; }
.diagram2 .d1 { bottom: 40px; left: 50px; }
.diagram2 .d2 { top: -40px; left: -40px; }
.diagram2 .d3 { bottom: -32px; left: -32px; }
.diagram2 .d4 { top: -32px; right: -42px; }
.diagram3 .d1 { top: 50px; left: 50px; }
.diagram3 .d2 { top: -40px; left: -40px; }
.diagram3 .d3 { top: -32px; right: -10px; }
.diagram4 .d1 { bottom: -60px; left: -60px; }
.diagram4 .d2 { top: -45px; left: 150px; }
.diagram4 .d3 { bottom: 53px; left: 56px; }
.diagram4 .d4 { bottom: -20px; right: -30px; }
.diagram4 .d5 { top: -32px; right: -32px; }

.diagram_review {
    width: 230px;
    height: 230px;
    top: calc(50% - 115px);
    left: calc(50% - 115px);
    padding: 5rem 0;
    color: #e52d27;
    line-height: 1.4;
}
.diagram_crown {
    display: block;
    color: #2c2d30;
    font-size: 2rem;
}
.diagram_num {
    font-size: 8rem;
}
.diagram_unit {
    font-size: 3.6rem;
}

@media (max-width: 767px) {
    .client-diagram {
		transform: scale(0.45);
        left: calc(50% - 356px);
		margin:-160px auto -150px auto;
    }
}

/* :::::: client-list :::::: */

#performance-client-section .column {
    max-width: 960px;
    margin: 80px auto 0;
}

.client-list {
    color: #e52d27;
    font-size: 1.2rem;
    letter-spacing: 0;
}

@media (min-width: 768px) {
    .client-list {
        border-right: 1px dashed #ccc;
        border-left: 1px dashed #ccc;
    }
    .client-list + .client-list {
        border-left: 0;
    }
}

@media (max-width: 767px) {
    #performance-client-section .column {
        margin-top: 20px;
        text-align: left;
    }
    .client-list br {
        display: none;
    }
    .client-list br.sp-only {
        display: block;
    }
}

/* :::::: logistics-map :::::: */

.logistics-map {
    position: relative;
    width: 712px;
    margin: 0 auto;
    padding: 24px 0 64px;
}
.logistics-list,
.logistics-item,
.logistics_bg .marker,
.logistics-item .dashline {
    position: absolute;
}

.logistics-list {
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.logistics-item.l1 {
    top: 0;
    left: 0;
}
.logistics-item.l2 {
    bottom: 0;
    right: 0;
}
.logistics-item img {
    z-index: 1;
    position: relative;
}
.logistics-item.l1 .dashline {
    right: -76px;
    bottom: -73px;
}
.logistics-item.l2 .dashline {
    right: 162px;
    bottom: 144px;
}

.logistics_caption {
    margin-bottom: 16px;
    line-height: 1.4;
}

.logistics_bg {
    position: relative;
}
.logistics_bg .marker1 {
    top: 258px;
    left: 255px;
}
.logistics_bg .marker2 {
    top: 241px;
    left: 427px;
}
.logistics_bg img {
    padding-left: 30px;
    box-sizing: content-box;
}

/* :::::: dashline svg :::::: */

.dashline path {
    fill: none;
    stroke: #231815;
    stroke-width: 1.5;
    stroke-dasharray: 4;
    stroke-miterlimit: 10;
}

/* :::::: marker svg :::::: */

.marker .pin {
    fill: #d73127;
    stroke: #231815;
    stroke-width: 2;
    stroke-miterlimit: 10;
}
.marker .hole {
    fill: #fff;
    stroke: #231815;
    stroke-width: 2;
    stroke-miterlimit: 10;
}

/* ==========================================================================
   Performance animation
   ========================================================================== */

@media (min-width: 1024px) {
    .cssanimations .graph_bar {
        width: 0;
        opacity: 0;
        transition: width .3s cubic-bezier(.1,.8,.35,1), opacity .3s;
    }
    [data-appeared="true"] .graph_bar {
        opacity: 1;
        transition-duration: 1s, .3s;
    }
    [data-appeared="true"] .g1 { width: 10%; transition-delay: .1s; }
    [data-appeared="true"] .g2 { width: 20%; transition-delay: .3s; }
    [data-appeared="true"] .g3 { width: 50%; transition-delay: .5s; }
    [data-appeared="true"] .g4 { width: 74%; transition-delay: .7s; }
    [data-appeared="true"] .g5 { width: 88%; transition-delay: .9s; }
    
    .cssanimations .awards-item .awards,
    .cssanimations .diagram-item,
    .cssanimations .logistics img,
    .cssanimations .logistics_bg .marker,
    .cssanimations .logistics-item .dashline {
        opacity: 0;
        transition: transform .3s, opacity .3s;
    }
    .cssanimations .awards-item .awards,
    .cssanimations .diagram-item,
    .cssanimations .logistics img {
        transform: scale(0);
    }
    .cssanimations .logistics_bg .marker {
        transform: translateY(-100px);
    }
    .cssanimations .l1 .dashline {
        transform: translate(-120px, -120px);
    }
    .cssanimations .l2 .dashline {
        transform: translate(120px, 120px);
    }
    [data-appeared="true"] .awards-item .awards,
    [data-appeared="true"] .diagram-item,
    [data-appeared="true"] .logistics img,
    [data-appeared="true"] .logistics_bg .marker,
    [data-appeared="true"] .logistics-item .dashline {
        opacity: 1;
        transform: none;
        transition-duration: .6s, .3s;
        transition-timing-function: cubic-bezier(.17,1.5,.5,1), ease;
    }
    [data-appeared="true"] .awards-item:nth-child(1) .awards { transition-delay: .1s }
    [data-appeared="true"] .awards-item:nth-child(2) .awards { transition-delay: .2s }
    [data-appeared="true"] .awards-item:nth-child(3) .awards { transition-delay: .3s }
    [data-appeared="true"] .awards-item:nth-child(4) .awards { transition-delay: .4s }
    [data-appeared="true"] .awards-item:nth-child(5) .awards { transition-delay: .5s }
    [data-appeared="true"] .awards-item:nth-child(6) .awards { transition-delay: .6s }
    [data-appeared="true"] .awards-item:nth-child(7) .awards { transition-delay: .7s }
    [data-appeared="true"] .awards-item:nth-child(8) .awards { transition-delay: .8s }
    
    [data-appeared="true"] .diagram1 .diagram-item.d1 { transition-delay: .1s; }
    [data-appeared="true"] .diagram1 .diagram-item.d2 { transition-delay: .2s; }
    [data-appeared="true"] .diagram1 .diagram-item.d3 { transition-delay: .3s; }
    
    [data-appeared="true"] .diagram2 .diagram-item.d1 { transition-delay: .2s; }
    [data-appeared="true"] .diagram2 .diagram-item.d2 { transition-delay: .3s; }
    [data-appeared="true"] .diagram2 .diagram-item.d3 { transition-delay: .4s; }
    [data-appeared="true"] .diagram2 .diagram-item.d4 { transition-delay: .5s; }
    
    [data-appeared="true"] .diagram3 .diagram-item.d1 { transition-delay: .3s; }
    [data-appeared="true"] .diagram3 .diagram-item.d2 { transition-delay: .4s; }
    [data-appeared="true"] .diagram3 .diagram-item.d3 { transition-delay: .5s; }
    
    [data-appeared="true"] .diagram4 .diagram-item.d1 { transition-delay: .4s; }
    [data-appeared="true"] .diagram4 .diagram-item.d2 { transition-delay: .5s; }
    [data-appeared="true"] .diagram4 .diagram-item.d3 { transition-delay: .6s; }
    [data-appeared="true"] .diagram4 .diagram-item.d4 { transition-delay: .7s; }
    [data-appeared="true"] .diagram4 .diagram-item.d5 { transition-delay: .8s; }
    
    [data-appeared="true"] .logistics_bg .marker,
    [data-appeared="true"] .logistics-item .dashline {
        transition-duration: .3s;
        transition-timing-function: cubic-bezier(.1,.8,.35,1);
    }
    [data-appeared="true"] .logistics_bg .marker1 { transition-delay: .1s; }
    [data-appeared="true"] .logistics-item.l1 img { transition-delay: .3s; }
    [data-appeared="true"] .logistics-item.l1 .dashline { transition-delay: .7s; }
    [data-appeared="true"] .logistics_bg .marker2 { transition-delay: .3s; }
    [data-appeared="true"] .logistics-item.l2 img { transition-delay: .5s; }
    [data-appeared="true"] .logistics-item.l2 .dashline { transition-delay: .9s; }
}

/* ==========================================================================
   CSR
   ========================================================================== */

[data-page="csr"] .visual_title {
    color: #fff;
}

#csr-intro-section,
#csr-accomplishments-section {
    z-index: 2;
}
#csr-accomplishments-section {
    background: #f8f8f9;
}

#csr-intro-section .section_lead {
    line-height: 1.4;
}
#csr-intro-section .section_lead,
#csr-intro-section .txt {
    margin-bottom: 32px;
}
#csr-intro-section .section_lead img {
    margin-bottom: 24px;
}
#csr-intro-section .section_lead br {
    display: block;
}

#csr-accomplishments-section .section_title {
    color: #2c2d30;
}

#csr-accomplishments-section .photo-info-list {
    margin-bottom: 48px;
}

@media screen and (min-width: 768px) {
    #csr-intro-section {
        padding: 56px 0 152px;
    }
    #csr-accomplishments-section {
        padding: 56px 0 96px;
    }
}

@media screen and (max-width: 767px) {
    #csr-intro-section .section_inner,
    #csr-accomplishments-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    #csr-intro-section .section_inner {
        padding-bottom: 120px;
    }
}

/* ==========================================================================
   Recruit
   ========================================================================== */

[data-page="joblist"] .visual_title,
[data-page="career"] .visual_title {
    color: #fff;
}


/* :::::: Job list :::::: */

#joblist-career-section .category_title,
#joblist-recruit-section .category_title {
    font-size: 1.6rem;
}

@media screen and (min-width: 768px) {
    #joblist-career-section,
    #career-details-section {
        padding: 72px 0;
    }
    #joblist-recruit-section {
        padding: 0 0 80px;
    }
}

@media screen and (max-width: 767px) {
    #joblist-career-section .section_inner,
    #career-details-section .section_inner {
        padding-top: 32px;
        padding-bottom: 32px;
    }
    #joblist-recruit-section .section_inner {
        padding-bottom: 56px;
    }
}

/* :::::: career details :::::: */

#career-details-section {
    z-index: 2;
}

/* :::::: career ENTRY :::::: */

#career-entry-section {
    background: #f9f9f9;
    overflow: hidden;
}

#career-entry-section .section_inner {
    max-width: 960px;
}

#career-entry-section .section_title {
    margin-bottom: 16px
}
#career-entry-section .section_title .en {
    color: #b6b6ba;
}
#career-entry-section .section_title .ja {
    color: #2c2d30;
    font-size: 1.8rem;
    line-height: 1.6;
}

#career-entry-section .entry.btn {
    color: #b6b6ba;
    font-size: 2.76rem;
    letter-spacing: .05em;
}
#career-entry-section .entry.btn:hover {
    border-color: #e52d27;
    color: #fff;
    background: #e52d27;
}
#career-entry-section .small.btn {
    width: 100%;
    max-width: 280px;
    min-width: 0;
}

#career-entry-section .bg {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    right: auto;
    width: 1366px;
    min-width: 1366px;
    -ms-transform: translate(-50%, -200px);
    transform: translate(-50%, -200px);
}

@media screen and (min-width: 768px) {
    #career-entry-section {
        padding: 160px 0 100px;
    }
    #career-entry-section .entry.btn {
        margin-bottom: 40px;
        padding: .2em;
    }
    #career-entry-section .bg {
    }
}

@media screen and (max-width: 767px) {
    #career-entry-section .section_inner {
        padding-top: 100px;
        padding-bottom: 50px;
    }
    #career-entry-section .entry.btn {
        padding: .6em;
    }
    #career-entry-section .bg {
        display: none;
    }
}

/* ==========================================================================
   News
   ========================================================================== */

.news_article {
    padding: 30px 0 120px;
}
.news_inner {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
}

.news_date {
    display: block;
    margin-bottom: 1em;
    color: #b6b7ba;
}
.news_title {
    margin-top: 0;
    color: #2c2d30;
}

.news_img {
    margin-bottom: 56px;
}
.news_main,
.news_aside {
    margin-bottom: 56px;
    text-align: left;
}

.news_main .txt:first-child {
    margin-top: 0;
}

.news_aside {
    background: #f1f3f5;
}
.news_aside .title {
    margin: 0 0 .5em;
    color: #65676e;
    font-size: 1.4rem;
}

.link-list {
    color: #65676e;
    font-size: 1.2rem;
}
.link-item a[target="_blank"] svg {
    position: relative;
    top: -.1em;
    margin-left: .3em;
}
.link-item a[target="_blank"]:hover svg {
    fill: #e52d27;
}

.news_article .btn {
    width: 100%;
    max-width: 450px;
}

@media screen and (min-width: 768px) {
    .news_title {
        font-size: 3rem;
        line-height: 1.4;
    }
    .news_main {
        float: left;
        width: 65%;
        padding-right: 56px;
    }
    .news_aside {
        float: right;
        width: 35%;
        padding: 32px 40px;
    }
}

@media screen and (max-width: 767px) {
    .news_title {
        font-size: 2rem;
    }
    .news_main {
        margin-bottom: 24px;
    }
    .news_aside {
        padding: 24px 32px;
    }
}

/* ==========================================================================
   Contact
   ========================================================================== */

[data-page="contact"] .visual_title,
[data-page="contactRecruit"] .visual_title {
    color: #fff;
}

#contact-section,
#contact-thanks-section {
    z-index: 2;
}
#contact-section,
#contact-privacy-section {
    text-align: left;
}
#contact-section .section_inner {
    max-width: 890px;
}

#contact-section .txt,
#contact-section .note,
#contact-privacy-section .title,
#contact-privacy-section .txt {
    margin-top: 0;
    margin-bottom: 0;
}
#contact-section .form-list {
    margin: 48px 0;
}
#contact-privacy-section .d-list {
    margin: 24px 0 48px;
    font-size: 1.2rem;
}

#contact-thanks-section .section_lead {
    letter-spacing: .05em;
}

label[for="contact-agreement"] {
    display: block;
    text-align: center;
}
#contact-agreement {
    position: relative;
    top: -.05em;
    margin-right: 1em;
    text-indent: 1em;
}
label[for="contact-agreement"],
#contact-submit {
    margin: 24px auto;
}

@media screen and (min-width: 768px) {
    #contact-section,
    #contact-thanks-section {
        padding: 56px 0 96px;
    }
    #contact-thanks-section {
        padding: 152px 0 120px;
    }
}

@media screen and (max-width: 767px) {
    #contact-section .section_inner,
    #contact-thanks-section .section_inner {
        padding-top: 32px;
        padding-bottom: 56px;
    }
    #contact-thanks-section .section_inner {
        padding-top: 96px;
        padding-bottom: 80px;
    }
}

/* :::::: form-list :::::: */

.form-list {
    border-top: 1px dotted #e3e4e6;
}
.form-item {
    border-bottom: 1px dotted #e3e4e6;
}
.form_row {
    width: 100%;
    margin: 0;
    letter-spacing: .05em;
}
.form_body {
    position: relative;
}

@media screen and (min-width: 768px) {
    #contact-privacy-section {
        margin: 48px 64px;
    }
    .form_row {
        display: table;
    }
    .form_row > * {
        display: table-cell;
        vertical-align: middle;
    }
    .form-item {
        padding: 24px .5em;
    }
    .form_head {
        width: 18em;
    }
}

@media screen and (max-width: 767px) {
    .form_head {
        padding: .8em 1em;
        background: #f7f7f7;
    }
    .form_body {
        padding: 1.2em 1em 2em;
        background: #FFF;
    }
}

/* :::::: input :::::: */

.form_body select,
.form_body input[type="text"],
.form_body input[type="email"],
.form_body input[type="tel"],
.form_body input[type="number"],
.form_body textarea {
    border-radius: 0;
}
.form_body input[type="text"],
.form_body input[type="email"],
.form_body input[type="tel"],
.form_body input[type="number"],
.form_body textarea {
    min-width: 80%;
    padding: .3em .6em;
    border: 1px solid #e3e4e6;
}
.form_body input[type="number"] {
    min-width: 0;
    width: 5em;
}
.form_body input[type="tel"] {
    min-width: 0;
    width: 11em;
}
.form_body textarea {
    width: 100%;
    min-height: 10em;
}
.form_body select {
    padding: .3em .6em;
    border: 1px solid #e3e4e6;
    background: #fff;
}
.touchevents .form_body select,
.touchevents .form_body input[type="text"],
.touchevents .form_body input[type="email"],
.touchevents .form_body input[type="tel"],
.touchevents .form_body input[type="number"],
.touchevents .form_body textarea {
    font-size: 1.6rem;
    border-radius: 0;
    -webkit-appearance: none;
}

.touchevents .select-wrap {
    position: relative;
}
.touchevents .select-wrap::before {
    content: "▼";
    position: absolute;
    top: calc(50% - 1em);
    right: 2em;
    font-size: 1rem;
    line-height: 1;
}

::-moz-placeholder { color: #aaa; }
:-ms-input-placeholder { color: #aaa; }
::-webkit-input-placeholder { color: #aaa; }

/* :::::: validation :::::: */

.form_body.match::before {
    content: "";
    display: block;
    position: absolute;
    width: 14px;
    height: 14px;
    background: url(../img/common/ico_checked.png) center no-repeat;
    background-size: 14px 14px;
}
.form_body[data-error]::after {
    content: attr(data-error);
    color: #e52d27;
    position: absolute;
    font-size: 1.2rem;
    line-height: 1;
    letter-spacing: 0;
}
.form_body[data-error] input[type="text"],
.form_body[data-error] input[type="email"],
.form_body[data-error] input[type="tel"],
.form_body[data-error] input[type="number"],
.form_body[data-error] textarea {
    border-color: #e99492;
    color: #fff;
    background: #f8a3a0;
}

/* :::::: label :::::: */

label[for] {
    cursor: pointer;
}
label[data-tag]::after {
    content: attr(data-tag);
    position: relative;
    top: -.1em;
    margin-left: .5em;
    padding: .3em .4em;
    border-radius: 2px;
    color: #fff;
    font-size: 1rem;
    background: #e52d27;
}
.form_body label,
.form_body .note,
.form_body .unit {
    position: relative;
    top: .1em;
    margin-right: .5em;
}
.form_body input + .unit {
    margin: 0 0 0 .5em;
}
.form_body input + label,
.form_body label + input[type="radio"],
.form_body input + .note {
    margin-left: 1em;
}
.form_body input[type="radio"] + label {
    margin-left: .5em;
}

@media screen and (min-width: 768px) {
    .form_body.match::before {
        top: calc(50% - .5em);
        left: -32px;
    }
    .form_body #contact-first-name,
    .form_body #contact-last-name,
    .form_body #contact-first-kana,
    .form_body #contact-last-kana {
        min-width: 0;
        width: 10em;
    }
    .form_body[data-error]::after {
        bottom: -1.5em;
        left: 0;
    }
    	.form_body select {
    height: 2.5em;
    padding: .3em .6em;
    }
}

@media screen and (max-width: 767px) {
    .form_body.match::before {
        top: -2.8rem;
        right: 1.5rem;
    }
    .form_body #contact-first-name,
    .form_body #contact-last-name {
        width: calc(50% - 3rem);
        min-width: 0;
    }
    .form_body #contact-first-kana,
    .form_body #contact-last-kana {
        width: calc(50% - 4.5rem);
        min-width: 0;
    }
    .form_body select {
        width: 100%;
        height: 2.5em;
    }
    .form_body[data-error]::after {
        bottom: 1em;
        left: 1em;
    }
}

@media screen and (max-width: 499px) {
    .form_body input[type="text"],
    .form_body input[type="email"],
    .form_body input[type="tel"] {
        width: 100%;
        min-width: 100%;
    }
    .form_body input + .note {
        margin: 0;
    }
}

/* :::::: d-list :::::: */

.d-list {
    line-height: 1.6;
    letter-spacing: .05em;
}
.d-term {
    margin-bottom: .5em;
}
.d-term::before {
    content: "";
    display: inline-block;
    position: relative;
    top: -.1em;
    width: .25em;
    height: .6em;
    margin-right: .5em;
    background: #e3e4e6;
}
.d-description + .d-term {
    margin-top: .5em;
}
.d-description {
    padding-left: 4em;
    text-indent: -.8em;
}
.d-description::before {
    content: "*";
    margin-right: .3em;
}

/* ==========================================================================
   Privacy Policy
   ========================================================================== */

#privacy-section .section_inner {
    padding-top: 60px;
    padding-bottom: 60px;
}

.privacy-section,
.sub-privacy-section {
    text-align: left;
}
.privacy-section_title,
.sub-privacy-section_title {
    color: #2c2d30;
}

.privacy-section {
    padding: 0 10px 60px;
}
.privacy-section_title {
    margin: 0 0 20px;
    font-size: 1.9rem;
    line-height: 1.2;
}
.privacy-section_title::before {
    content: "";
    display: inline-block;
    position: relative;
    top: -.1em;
    width: 8px;
    height: .95em;
    margin-right: .5em;
    vertical-align: middle;
    background: #b6b7ba;
}

.sub-privacy-section {
    margin: 2em 0;
}
.sub-privacy-section_title {
    font-size: 1.5rem;
}

.privacy-section .txt,
.privacy-item,
.sub-privacy-item,
.global-sign {
    padding-left: 20px;
}

.privacy-list,
.sub-privacy-list {
    margin: 1em 0;
    font-size: 1.2rem;
    letter-spacing: 0;
}
.privacy-list {
    margin: 2em 0;
}
.privacy-item,
.sub-privacy-item {
    position: relative;
}
.privacy-item {
    margin: 2em 0;
}
.privacy-item[data-num]::before,
.sub-privacy-item[data-num]::before {
    content: attr(data-num);
    position: absolute;
    left: 0;
    color: #b6b7ba;
}

@media screen and (min-width: 480px) {
    .privacy-section {
        padding: 0 30px 60px;
    }
    .privacy-section_title {
        margin: 0 -10px 40px;
    }
}

@media screen and (min-width: 768px) {
    .privacy-section {
        padding: 0 60px 60px;
    }
    .privacy-section_title {
        margin: 0 -30px 40px;
    }
    .privacy-section .txt,
    .privacy-item,
    .sub-privacy-list,
    .sub-privacy-item,
    .global-sign {
        padding: 0 20px;
    }
}

.global-sign img {
    margin: 1em 0;
}

.note {
    color: #616266;
    font-size: 1.2rem;
    letter-spacing: 0;
}
.txt .note {
    display: block;
    padding-left: 1em;
    font-size: 1rem;
    line-height: 1.6;
    text-indent: -1em;
}

/* ==========================================================================
   Site Map
   ========================================================================== */

#sitemap-section .section_inner {
    max-width: 960px;
    padding: 60px 0 90px;
}

#sitemap-section .sitemap-list {
    text-align: left;
}

#sitemap-section .sub-sitemap-list {
    padding: 1em 0;
    font-size: 1.2rem;
}
#sitemap-section .sub-sitemap-item a {
    padding-left: 1em;
}

@media screen and (max-width: 767px) {
    #sitemap-section .section_inner {
        padding: 30px 0;
    }
    #sitemap-section .sitemap-item,
    #sitemap-section .sub-sitemap-list,
    #sitemap-section .other-sitemap-item {
        padding: 0;
        border-top: 1px solid #eee;
    }
    #sitemap-section .other-sitemap-list {
        border-bottom: 1px solid #eee;
    }
    #sitemap-section .sitemap-item a {
        display: block;
        padding: 1em 2rem;
        background: #f4f5f6;
    }
    #sitemap-section .sub-sitemap-item + .sub-sitemap-item {
        border-top: 1px solid #f4f4f4;
    }
    #sitemap-section .sub-sitemap-item a {
        background: #fff;
    }
}