@charset "utf-8";


/*
   helper
==================================================================================================== */
/*
   margin
------------------------------ */
.mt-00 { margin-top: 0 !important; }
.mt-05 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-15 { margin-top: 15px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-25 { margin-top: 25px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-35 { margin-top: 35px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-45 { margin-top: 45px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-55 { margin-top: 55px !important; }
.mt-60 { margin-top: 60px !important; }

.mb-00 { margin-bottom: 0 !important; }
.mb-05 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-15 { margin-bottom: 15px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-25 { margin-bottom: 25px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-35 { margin-bottom: 35px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-45 { margin-bottom: 45px !important; }
.mb-50 { margin-bottom: 50px !important; }

.ml-00 { margin-left: 0 !important; }
.mr-00 { margin-right: 0 !important; }

.mt-l { margin-top: 120px !important; }
.mt-m { margin-top: 90px !important; }
.mt-s { margin-top: 60px !important; }
.mt-xs { margin-top: 30px !important; }
.mt-xxs { margin-top: 20px !important; }

.mb-l { margin-bottom: 120px !important; }
.mb-m { margin-bottom: 90px !important; }
.mb-s { margin-bottom: 60px !important; }
.mb-xs { margin-bottom: 30px !important; }

@media screen and (max-width: 1023px) {
    .mt-l { margin-top: 80px !important; }
    .mt-m { margin-top: 60px !important; }
    .mt-s { margin-top: 40px !important; }
    .mt-xs { margin-top: 20px !important; }

    .mb-l { margin-bottom: 80px !important; }
    .mb-m { margin-bottom: 60px !important; }
    .mb-s { margin-bottom: 40px !important; }
    .mb-xs { margin-bottom: 20px !important; }
}

@media screen and (max-width: 639px) {
    .mt-l { margin-top: 50px !important; }
    .mt-m { margin-top: 40px !important; }
    .mt-s { margin-top: 30px !important; }
    .mt-xs { margin-top: 20px !important; }

    .mb-l { margin-bottom: 50px !important; }
    .mb-m { margin-bottom: 40px !important; }
    .mb-s { margin-bottom: 30px !important; }
    .mb-xs { margin-bottom: 20px !important; }
}



/*
   font size
------------------------------ */
.fs-l { font-size: 18px !important; }
.fs-m { font-size: 16px !important; }
.fs-s { font-size: 12px !important; }

@media screen and (max-width: 639px) {
    .fs-l { font-size: 16px !important; }
    .fs-m { font-size: 14px !important; }
    .fs-s { font-size: 11px !important; }
}



/*
   padding
------------------------------ */
.pt-00 { padding-top: 0 !important; }
.pt-40 { padding-top: 40px !important; }
.pb-00 { padding-bottom: 0 !important; }
.p-20 { padding: 0 20px !important; }
.p-00 { padding: 0 !important; }

.pt-37 {
    padding-top: 37px !important;
}
.pb-37 {
    padding-bottom: 37px !important;
}

.text-indent-01 {
    text-indent: -1em;
    padding-left: 1em;
}



/*
   alignment
------------------------------ */
.t-left { text-align: left !important; }
.t-right { text-align: right !important; }
.t-center { text-align: center !important; }

@media screen and (max-width: 639px) {
    .t-center { text-align: left !important; }
    .sp-t-left { text-align: left !important; }
    .sp-t-right { text-align: right !important; }
    .sp-t-center { text-align: center !important; }
}



/*

------------------------------ */
.lh-10 {
    line-height: 1.0;
}
.lh-15 {
    line-height: 1.5;
}
.lh-23 {
    line-height: 2.3;
}


.bold {
    font-weight: bold;
}


/*
   none
------------------------------ */
.pc-none {
    display: none;
}
.tab-visible {
    display: none;
}
.sp-visible {
    display: none;
}

.pc-visible {
    display: inherit;
}
@media screen and (max-width: 1023px) {
    .tab-none {
        display: none;
    }
    .tab-visible {
        display: inherit;
    }

    .pc-none {
        display: inherit;
    }

    .sp-visible {
        display: none;
    }

    .pc-visible {
        display: none;
    }
}
@media screen and (max-width: 639px) {
    .sp-none {
        display: none;
    }

    .sp-visible {
        display: inherit;
    }

    .pc-visible {
        display: none;
    }
    .tab-visible {
        display: none;
    }
}


/*
   hover
------------------------------ */
.opacity a img,
.opacity a > g {
    opacity: 1;
    -webkit-backface-visibility: hidden; /* 追加 */
    backface-visibility: hidden; /* 追加 */
    transition: 0.3s linear;
}
.opacity a:hover img,
.opacity a:hover > g {
    opacity: 0.7;
}




/*
   patts
==================================================================================================== */
/*
   hover
------------------------------ */
.hover-line {
    padding-bottom: 1px;
}
a:hover .hover-line {
    border-bottom: 1px solid #000000;
    padding-bottom: 1px;
}

.a-underline {
    text-decoration: underline;
}
.a-underline:hover {
    text-decoration: none;
}

.hover-arrow,
.hover-arrow-02 {
    position: relative;
    margin: 0 8px;
    vertical-align: super;
}
/*.hover-arrow-02 {
    margin: 0 20px;
}*/
.hover-arrow:before {
    position: absolute;
    left: -10px;
    top: 0;
    font-size:13px;
    font-weight: 400;
    content: "→";
    opacity: 0;
    transition: all 350ms;
}
a:hover .hover-arrow:before {
    opacity: 1;
    left: 0;
}
.hover-arrow:after {
    position: absolute;
    left: 0;
    top: 0;
    font-size:13px;
    font-weight: 400;
    content: "→";
    opacity: 1;
    transition: all 250ms;
}
a:hover .hover-arrow:after {
    opacity: 0;
    left: 20px;
}

.hover-arrow-02:after {
    position: absolute;
    left: -2px;
    top: 0;
    font-size:13px;
    font-weight: 400;
    content: "←";
    opacity: 0;
    transition: all 350ms;
}
a:hover .hover-arrow-02:after {
    opacity: 1;
    left: -12px;
}
.hover-arrow-02:before {
    position: absolute;
    left: -12px;
    top: 0;
    font-size:13px;
    font-weight: 400;
    content: "←";
    opacity: 1;
    transition: all 250ms;
}
a:hover .hover-arrow-02:before {
    opacity: 0;
    left: -32px;
}

.hover-arrow.t-bottom,
.hover-arrow-02.t-bottom {
    vertical-align: bottom;
}



/*
   breadcrumb
------------------------------ */
.breadcrumb-nav {
    padding: 0 0 50px;
    line-height: 1.5;
}
.breadcrumb-nav,
.breadcrumb-nav li a {
    color: #333333;
}
.breadcrumb-nav li a:hover {
    text-decoration: underline;
}
.breadcrumb-nav li {
    display: inline;
}
.breadcrumb-nav li:first-child {
    background: url(../img/common/breadcrumb-nav-icon.png) left center no-repeat;
    padding: 0 0 0 24px;
}
.breadcrumb-nav li + li:before {
    content: "> ";
    padding-left: 5px;
}
.breadcrumb-nav + * {
    margin-top: 0 !important;
}

@media screen and (max-width: 1599px) {
    .breadcrumb-nav {
        text-align: center;
    }
}

@media screen and (max-width: 1023px) {
    .breadcrumb-nav {
        padding: 0 0 30px;
    }
}

@media screen and (max-width: 959px) {
    .breadcrumb-nav {
        padding: 0 0 20px;
        text-align: left;
    }
    .breadcrumb-nav li {
        font-size: 12px;
    }
}



/*
   section
------------------------------ */
.section {
    padding: 100px 0;
}

/* 変な余白が出るため、対応*/
.page-template-page-en-company_history .section {
    padding-top: 100px;
    padding-bottom: 0px;
}

.section .section {
    padding: 100px 0 0;
}

.section .section-sm {
    padding: 80px 0 0;
}

.section-header {
    text-align: center;
    margin: 0 0 60px 0;
    line-height: 1.3;
}
.section-header h1 {
    font-weight: 400;
    font-size: 56px;
}
.section-header p {
    font-size: 18px;
}
.section-header p.v-top {
    margin-top: 10px;
}

.section-header-02 {
    text-align: center;
    margin: 0 0 40px 0;
    line-height: 1.5;
}
.section-header-02 h1 {
    font-weight: 400;
    font-size: 38px;
}
.section-header-02 p {
    font-size: 16px;
}

.section-header-03 {
    text-align: center;
    margin: 0 0 60px 0;
    line-height: 1.3;
    padding: 0 20px;
}
.section-header-03 h1 {
    font-size: 32px;
}
.section-header-03 h1 span {
    font-size: 26px;
}
.section-header-03 p.note {
    font-size: 10px;
    color: #a4a0a0;
    margin-top: 18px;
    line-height: 1.6;
    letter-spacing: 1px;
}

.section-header-04 {
    text-align: center;
    margin: 0 0 40px 0;
    line-height: 1.3;
    padding: 0 20px;
}
.section-header-04 h1,
.section-header-04 h2 {
    font-size: 28px;
}

.section-header-balloon {
    text-align: center;
    background: #dff0f4;
    border-radius: 7px;
    position: relative;
    padding: 50px 0;
}
.section-header-balloon:after {
    content: "";
	position: absolute;
	bottom: -16px; left: 50%;
	margin-left: -8px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 16px 8px 0 8px;
	border-color: #dff0f4 transparent transparent transparent;
}
.section-header-balloon h1 {
    font-weight: 400;
    font-size: 50px;
    line-height: 1.1;
}
.section-header-balloon p {
    font-size: 18px;
    line-height: 1.3;
    margin: 10px 0 0 0;
}

.section-header p.base {
    margin-top: 10px;
}

.section-header-03 p {
    font-size: 14px;
    margin-top: 10px;
}

.section-header-05 {
    text-align: center;
    margin: 0 0 40px 0;
    line-height: 1.3;
    padding: 0 20px;
}
.section-header-05 h1 {
    font-size: 32px;
}

.section-header-06 {
    text-align: center;
    margin: 0 0 50px 0;
    line-height: 1.3;
    padding: 0 20px;
}
.section-header-06 span {
    font-size: 22px;
    font-style: italic;
    color: #549faf;
    margin: 0 0 27px 0;
    display: block;
}
.section-header-06 h1 {
    font-size: 32px;
    margin: 0 0 24px 0;
}
.section-header-06 p {
    font-size: 18px;
}

.section-header-07 {
    text-align: center;
    margin: 0 0 40px 0;
    line-height: 1.3;
    padding: 0 20px;
}
.section-header-07 h1 {
    font-size: 24px;
}

@media screen and (max-width: 1023px) {
    .section {
        padding: 70px 0;
    }
    .section .section {
        padding: 70px 0 0;
    }

    .section .section-sm {
        padding: 60px 0 0;
    }

    .section-header {
        margin: 0 0 40px 0;
    }
    .section-header h1 {
        font-size: 42px;
    }
    .section-header p {
        font-size: 18px;
    }

    .section-header-03 {
        margin: 0 0 30px 0;
    }
    .section-header-03 h1 {
        font-size: 26px;
    }
    .section-header-03 h1 span {
        font-size: 18px;
    }

    .section-header-04 {
        margin: 0 0 30px 0;
    }
    .section-header-04 h1,
    .section-header-04 h2 {
        font-size: 24px;
    }

    .section-header-balloon {
        padding: 30px 0;
    }
    .section-header-balloon h1 {
        font-size: 32px;
    }
    .section-header-balloon p {
        font-size: 14px;
    }

    .section-header-05 {
        margin: 0 0 30px 0;
    }
    .section-header-05 h1 {
        font-size: 24px;
    }

    .section-header-06 {
        margin: 0 0 30px 0;
    }
    .section-header-06 span {
        font-size: 18px;
        margin: 0 0 20px 0;
    }
    .section-header-06 h1 {
        font-size: 28px;
        margin: 0 0 17px 0;
    }
    .section-header-06 p {
        font-size: 16px;
    }
}

@media screen and (max-width: 639px) {
    .section {
        padding: 40px 0;
    }
    .section .section {
        padding: 40px 0 0;
    }

    .section .section-sm {
        padding: 30px 0 0;
    }

    .section-header {
        margin: 0 0 30px 0;
    }
    .section-header h1 {
        font-size: 34px;
    }
    .section-header p {
        font-size: 16px;
    }

    .section-header-02 {
        margin: 0 0 30px 0;
    }
    .section-header-02 h1 {
        font-size: 24px;
        line-height: 1.2;
    }
    .section-header-02 p {
        font-size: 12px;
    }

    .section-header-03 {
        margin: 0 0 20px 0;
    }
    .section-header-03 h1 {
        font-size: 24px;
    }

    .section-header-04 {
        margin: 0 0 20px 0;
    }
    .section-header-04 h1,
    .section-header-04 h2 {
        font-size: 20px;
    }

    .section-header-balloon {
        padding: 20px 0;
    }
    .section-header-balloon h1 {
        font-size: 24px;
    }
    .section-header-balloon p {
        font-size: 12px;
    }

    .section-header p.base {
        margin-top: 4px;
    }

    .section-header-05 {
        margin: 0 0 20px 0;
    }
    .section-header-05 h1 {
        font-size: 20px;
    }

    .section-header-06 {
        margin: 0 0 20px 0;
    }
    .section-header-06 span {
        font-size: 16px;
        margin: 0 0 12px 0;
    }
    .section-header-06 h1 {
        font-size: 24px;
        margin: 0 0 10px 0;
    }
    .section-header-06 p {
        font-size: 14px;
    }

    .section-header-07 {
        margin: 0 0 20px 0;
    }
    .section-header-07 h1 {
        font-size: 18px;
    }
}



/*
   heading
------------------------------ */
.heading-01 {
    text-align: center;
    margin: 0 0 30px 0;
    line-height: 1.5;
    padding: 0 20px;
}
.heading-01 h2 {
    font-size: 28px;
}
.heading-02 {
    text-align: center;
    margin: 0 0 30px 0;
    line-height: 1.5;
    padding: 0 20px;
}
.heading-02 h1,
.heading-02 h2 {
    font-size: 24px;
}
.brand-con .heading-02 h1 {
    font-size: 22px;
}
.heading-03 {
    text-align: center;
    margin: 0 0 20px 0;
    line-height: 1.5;
    padding: 0 20px;
}
.heading-03 h2,
.heading-03 h3 {
    font-size: 20px;
}
.brand-con .heading-03 h2 {
    font-size: 18px;
}

.heading-04 {
    margin: 30px 0 0 0;
    padding: 0 10px;
    background-color: #549faf;
    display:inline-block;
    border-radius: 2px;
}
.heading-04 h3 {
    font-size: 12px;
    color: #ffffff;
}

.heading-05 {
    margin: 0 0 30px 0;
    text-align: center;
}
.heading-05 h2 {
    font-size: 18px;
    font-weight: bold;
}

.heading-06 {
    margin: 0 0 20px 0;
    line-height: 1.5;
}
.heading-06 h2 {
    font-size: 18px;
    font-weight: bold;
}

@media screen and (max-width: 639px) {
    .heading-01 {
        margin: 0 0 20px 0;
    }
    .heading-01 h2 {
        font-size: 20px;
        line-height: 1.5;
    }

    .heading-02 {
        margin: 0 0 20px 0;
    }
    .heading-02 h1,
    .heading-02 h2 {
        font-size: 20px;
        line-height: 1.4;
    }

    .heading-03 {
        margin: 0 0 15px 0;
    }
    .heading-03 h2,
    .heading-03 h3 {
        font-size: 16px;
    }
}



/*
   color
------------------------------ */
.fc-white {
    color: #ffffff;
}
.fc-green {
    color: #549faf;
}



/*
   bg
------------------------------ */
.bg-green {
    background-color: #e8f4f7;
}
.bg-green-02 {
    background-color: #549faf;
}
.bg-green-03 {
    background-color: #dff0f4;
}
.bg-gray {
    background-color: #f2f2f2;
}
.bg-gray-02 {
    background-color: #fafafa;
}
.bg-yellow {
    background-color: #fdfcf2;
}
.bg-white {
    background-color: #ffffff;
}
.bg-blue {
    background-color: #e8f4f7;
}

.bg-wave_under_green {
    background-image: url(../img/common/wave_under_green_02.png);
    background-position: center bottom;
    background-repeat: no-repeat;
}

.bg-yellow-02 {
    background-color: #f8f6e7;
}
.bg-yellow-03 {
    background: url(../img/common/bg-dot.png) repeat;
}

@media screen and (max-width: 639px) {
    .sp-bg-white {
        background-color: #ffffff !important;
    }
}



/*
   p
------------------------------ */
p + p {
    margin-top: 20px;
}

p small {
    font-size: 12px;
    line-height: 1.7;
}

.texth-m {
    line-height:2.6;
}

@media (max-width: 639px) {
    p + p {
        margin-top: 15px;
    }
    .texth-m {
        line-height:2;
    }
}

.highlight-blue {
    background-color: #82c2e0;
    padding: 5px 10px;
    color: #ffffff;
}
.line-through {
    text-decoration: line-through;
}



/*
   rule
------------------------------ */
.rule {
    height: 1px;
    background: #e6e6e6;
    max-width: 1024px;
    margin: 0 auto;
}



/*
   pic deco
------------------------------ */
.pic-radius {
    border-radius: 7px;
}
.pic-radius-02 {
    border-radius: 7px 7px 0 0;
}

.pic-deco {
    width: 100%;
    height: 460px;
}

/* HOME */
.pic-deco.home-1 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_yellow.png), url(../img/home/bg_pic_01.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

.page-template-page-en .pic-deco.home-1 {
    background-image: url(../img/common/wave_top_up_green.png), url(../img/common/wave_under_yellow.png), url(../img/home/bg_pic_01.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

.handmade-bg {
    background-image: url(../img/common/wave_under_white.png);
    background-position: bottom center;
    background-repeat: no-repeat;
}

/* インタビュー01 */
.pic-deco.inter01-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail01_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter01-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail01_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー02 */
.pic-deco.inter02-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail02_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter02-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail02_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー03 */
.pic-deco.inter03-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail03_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter03-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail03_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー04 */
.pic-deco.inter04-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail04_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter04-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail04_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー05 */
.pic-deco.inter05-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail05_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter05-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail05_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー06 */
.pic-deco.inter06-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail06_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter06-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail06_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー07 */
.pic-deco.inter07-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail07_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter07-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail07_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー08 */
.pic-deco.inter08-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail08_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter08-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail08_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー09 */
.pic-deco.inter09-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail09_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter09-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail09_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー10 */
.pic-deco.inter10-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail10_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter10-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail10_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー11 */
.pic-deco.inter11-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail11_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter11-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail11_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

/* インタビュー12 */
.pic-deco.inter12-1 {
    background-image: url(../img/common/wave_up_green.png), url(../img/common/wave_under_white.png), url(../img/interview/detail12_pic_04.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}
.pic-deco.inter12-2 {
    background-image: url(../img/common/wave_up_white.png), url(../img/common/wave_under_green.png), url(../img/interview/detail12_pic_05.jpg);
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-size: auto, auto, cover;
    background-position: center top, center bottom, center center;
}

@media screen and (max-width: 1023px) {
    .pic-deco {
        height: 240px;
    }
}

@media screen and (max-width: 639px) {
    .page .main-header2 > div,
    .archive .main-header2 > div,
    .single .main-header2 > div,
    .blog .main-header2 > div,
    .error404 .main-header2 > div {
        background-image: none;
    }

    .pic-deco {
        /*height: 120px;*/
        height: 180px;
    }

    /* HOME */
    .pic-deco.home-1 {
        background-image: url(../img/home/bg_pic_01.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー01 */
    .pic-deco.inter01-1 {
        background-image: url(../img/interview/detail01_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter01-2 {
        background-image: url(../img/interview/detail01_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー02 */
    .pic-deco.inter02-1 {
        background-image: url(../img/interview/detail02_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter02-2 {
        background-image: url(../img/interview/detail02_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー03 */
    .pic-deco.inter03-1 {
        background-image: url(../img/interview/detail03_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter03-2 {
        background-image: url(../img/interview/detail03_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー04 */
    .pic-deco.inter04-1 {
        background-image: url(../img/interview/detail04_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter04-2 {
        background-image: url(../img/interview/detail04_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー05 */
    .pic-deco.inter05-1 {
        background-image: url(../img/interview/detail05_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter05-2 {
        background-image: url(../img/interview/detail05_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー06 */
    .pic-deco.inter06-1 {
        background-image: url(../img/interview/detail06_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter06-2 {
        background-image: url(../img/interview/detail06_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー07 */
    .pic-deco.inter07-1 {
        background-image: url(../img/interview/detail07_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter07-2 {
        background-image: url(../img/interview/detail07_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー08 */
    .pic-deco.inter08-1 {
        background-image: url(../img/interview/detail08_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter08-2 {
        background-image: url(../img/interview/detail08_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー09 */
    .pic-deco.inter09-1 {
        background-image: url(../img/interview/detail09_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter09-2 {
        background-image: url(../img/interview/detail09_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー10 */
    .pic-deco.inter10-1 {
        background-image: url(../img/interview/detail10_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter10-2 {
        background-image: url(../img/interview/detail10_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー11 */
    .pic-deco.inter11-1 {
        background-image: url(../img/interview/detail11_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter11-2 {
        background-image: url(../img/interview/detail11_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* インタビュー12 */
    .pic-deco.inter12-1 {
        background-image: url(../img/interview/detail12_pic_04.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    .pic-deco.inter12-2 {
        background-image: url(../img/interview/detail12_pic_05.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center right;
    }

    .pic-sp-half {
        width: 50%;
    }
}



/*
   hr
------------------------------ */
.hr-yellow {
    border: none;
    border-top: 1px solid #e7e4d0;
}



/*
   btn
------------------------------ */
.btn-layout {
    text-align: center;
}
.btn-layout > * {
    display: inline-block;
    padding: 0 20px;
}
.btn,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    display: inline-block;
    width: 270px;
    margin: 0 auto;
    font-size: 20px;
    text-align: center;
    padding: 20px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}
.btn-primary {
    background: #ffffff;
    color: #2e8598;
}
.btn-primary:hover {
    background: #2e8598;
    color: #ffffff;
}
.btn-secondary {
    background: #2e8598;
    color: #ffffff;
}
.btn-small {
    background: #549faf;
    color: #ffffff;
    padding: 10px 0;
    width: 200px;
    border-radius: 2px;
}
.btn-small-wide {
    background: #549faf;
    color: #ffffff;
    padding: 10px 0;
    width: 80%;
}
.btn-small-wide .text-s {
    font-size: 16px;
}
.btn-small-wide:hover {
    background: #2e8598;
}
input[type="submit"],
.btn-herb {
    background: #549faf url(../img/common/btn_bg_herb.png) center center no-repeat;
    color: #ffffff;
}
input[type="submit"]:hover,
.btn-herb:hover {
    background: #2e8598 url(../img/common/btn_bg_herb.png) center center no-repeat;
}
input[type="submit"][name="submitBack"],
.btn-herb.cancel {
    background: #dff0f4 url(../img/common/btn_bg_herb.png) center center no-repeat;
    color: #000000;
}
.btn-herb-02 {
    background: #c7bf73 url(../img/common/btn_bg_herb.png) center center no-repeat;
    color: #ffffff;
}
.btn-herb-02:hover {
    background: #b4ab56 url(../img/common/btn_bg_herb.png) center center no-repeat;
}

@media screen and (max-width: 1023px) {
    main .btn,
    main input[type="button"],
    main input[type="reset"],
    main input[type="submit"] {
        font-size: 16px;
        padding: 18px 0;
    }

    main .btn-small-wide {
        padding: 0;
        width: 100%;
    }

    main .sustainable-topic-btn {
        width: 400px;
        font-size: 20px;
    }
}

@media screen and (max-width: 639px) {
    .btn,
    input[type="button"],
    input[type="reset"],
    input[type="submit"] {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .btn-layout > * {
        display: block;
        padding: 0;
    }
    .btn-layout > * + * {
        margin: 20px 0 0 0;
    }

    .fb-btn {
        text-align: center;
        margin: 20px 0 0 0;
    }
    .fb-btn a {
        display: inline-block;
        width: 100%;
        font-size: 14px;
        font-weight: bold;
        text-align: center;
        padding: 10px 0;
        background: #3b5999 url(../img/common/icon_fb_01.png) 10px center no-repeat;
        background-size: 30px auto;
        color: #ffffff;
    }

    .btn-small {
        width: 150px;
    }

    .btn-small-wide .text-s {
        font-size: 12px;
    }
}



/*
   img layout
------------------------------ */
.img-layout {
    border-radius: 7px;
    display: table;
    width: 100%;
}
.img-layout.brands {
    padding: 30px;
    background: #ffffff;
}
.img-layout > div {
    display: table-cell;
    vertical-align: middle;
    text-align: left;
}
.img-layout .title {
    font-size: 16px;
    font-weight: bold;
}
.img-layout .title span {
    font-size: 24px;
    font-weight: 400;
    margin-right: 10px;
}
.img-layout .title img,
.img-layout-03 .title img {
    margin: 0 0 20px 0;
}
.img-layout .link,
.img-layout-03 .link {
    margin: 20px 0 0 0;
    line-height: 1;
}
.img-layout .img {
    text-align: right;
}
.img-layout.beautylibrary .img {
    width: 345px;
}
.img-layout.brands .img {
    width: 240px;
    padding-left: 30px;
}
.img-layout.brands .img img {
    width: 100%;
}

.img-layout-02 {
    width: 960px;
    margin: 0 auto;
}
.img-layout-02 .img {
    float: right;
    width: 210px;
}
.img-layout-02 .text {
    float: left;
    width: 750px;
    padding: 50px 70px 0 0;
    line-height: 1.8;
}

.img-layout-03 .img {
    float: right;
    width: 310px;
}
.img-layout-03 .text {
    float: left;
    width: 436px;
    padding: 0 35px 0 0;
}
.img-layout-03 .text-02 {
    font-size: 16px;
}

@media screen and (max-width: 1000px) {
    .img-layout-02 {
        width: 100%;
        margin: 0;
        padding: 0 20px;
    }
    .img-layout-02 .img {
        width: 21.875%;
    }
    .img-layout-02 .text {
        float: left;
        width: 78.125%;
        padding: 50px 7.3% 0 0;
    }

    .img-layout-03 .img {
        width: 41.55%;
    }
    .img-layout-03 .text {
        width: 58.45%;
        padding: 0 4.7% 0 0;
    }
}
@media screen and (max-width: 639px) {
    .img-layout {
        display: block;
    }
    .img-layout.weleda {
        padding: 20px;
    }
    .img-layout > div {
        display: block;
    }
    .img-layout .title {
        line-height: 1.5;
        margin-bottom: 10px;
    }
    .img-layout .title span {
        display: block;
    }
    .img-layout .img {
        width: 100% !important;
        text-align: center;
        margin: 20px 0 0 0;
    }
    .img-layout.brands .img {
        width: 70% !important;
        padding-left: 0;
        margin: 20px auto 0;
    }

    .img-layout-02 .img {
        float: none;
        width: 100%;
        text-align: center;
    }
    .img-layout-02 .img img {
        max-width: 160px;
    }
    .img-layout-02 .text {
        float: none;
        width: 100%;
        padding: 20px 0 0 0;
    }

    .img-layout-03 .img {
        float: none;
        width: 100%;
        text-align: center;
    }
    .img-layout-03 .text {
        float: none;
        width: 100%;
        padding: 20px 0 0 0;
    }
    .img-layout-03 .text-02 {
        font-size: 14px;
    }
    .img-layout-03 .link {
        text-align: center;
    }
    .img-layout-03 .link a {
        display: block;
        border: 1px solid #cccccc;
        border-radius: 3px;
        padding: 10px 0;
    }
}



/*
   main header
------------------------------ */
.main-header {
    position: relative;
    height: 750px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
}
.main-header > * {
    height: 750px;
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
}
.main-header .main-img > * {
    width: 100%;
    height: 100%;
}


.main-header2 {
    height: 300px;
    width: 100%;
/*
    background-repeat: no-repeat, no-repeat;
    background-size: auto, cover;
    background-position: center bottom, center top;
*/
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center top;
    display: table;
    color: #ffffff;
    text-shadow: rgba(0,0,0,0.20) 0 0 7px;
    line-height: 1.5;
}
.main-header2 > div {
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.main-header2 h1 {
    font-size: 80px;
    font-weight: 400;
    letter-spacing: 0.05em;
    line-height:1;
}
.main-header2 p {
    font-size: 24px;
    letter-spacing: 0.22em;
    line-height:1;
    margin-top: 5px;
}
.main-header2 p.base {
    margin-top: 20px;
}

/* home */
.home .main-header,
.home .main-header-sp {
    height: 750px;
    width: 100%;
    color: #ffffff;
    text-shadow: rgba(0,0,0,0.20) 0 0 7px;
    line-height: 1.5;
    text-align: center;
    overflow: hidden;
}
.home .main-header-sp {
    position: relative;
    height: 400px;
}
.home .main-header .mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 750px;
    background-color: rgba(28,9,2,0.25);
    background-image: url(../img/common/wave_main_under_green_02.png);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
    padding-top: 90px;
    z-index: 10000;
}

.page-template-page-en .main-header .mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 750px;
    background-color: rgba(28,9,2,0.25);
    background-image: url(../img/common/wave_main_under_white.png);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: center bottom;
    padding-top: 200px;
    z-index: 10000;
}

.home .main-header h1,
.home .main-header-sp h1 {
    font-size: 98px;
    font-weight: 400;
    letter-spacing: 0.05em;
    z-index: 20000;
    text-align: center;
}
.home .main-header p,
.home .main-header-sp p {
    font-size: 42px;
    line-height: 1.4;
    letter-spacing: 0.22em;
    z-index: 20000;
    text-align: center;
}

.sustainable-topic-btn {
    width: 400px;
    background-color: transparent;
    border: 1px solid #fff;
}

.sustainable-topic-btn:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
    border: 1px solid #fff;
    opacity: 1;
}

.home .main-header .sustainable-topic-area .sustainable-text {
    font-size: 24px;
    line-height: 1.4;
    letter-spacing: 0.22em;
    z-index: 20000;
}

body .home .main-header-sp,
body .bx-wrapper .bx-viewport .slider,
body .bx-wrapper .bx-viewport li,
body .slider li {
	height: 690px;
}
body .bx-wrapper {
	margin-bottom: 0;
}
/*
body .bx-wrapper .bx-viewport li {
	opacity: 0;
}
body .bx-wrapper .bx-viewport li.active {
	opacity: 1;
}
*/
body .bx-wrapper .bx-viewport li img {
	height: 100%;
}
body .home .main-header-sp {
	position: relative;
}
body .bx-wrapper .bx-viewport {
	left: 0;
	border: none;
	box-shadow: none;
	background: none;
}
body .bx-wrapper .bx-pager,
body .bx-wrapper .bx-controls-auto {
	bottom: 15px;
}
body .bx-wrapper .bx-pager.bx-default-pager a,
body .bx-wrapper .bx-pager.bx-default-pager a:hover {
	margin: 0 5px;
	background-color: #ffffff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
body .bx-wrapper .bx-pager.bx-default-pager a {
	width: 10px;
	height: 10px;
	border-radius: 8px;
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-ms-transform: scale(0.5);
	-o-transform: scale(0.5);
	transform: scale(0.5);
}
body .bx-wrapper .bx-pager.bx-default-pager a:hover,
body .bx-wrapper .bx-pager.bx-default-pager a.active {
	-webkit-transform: scale(1.0);
	-moz-transform: scale(1.0);
	-ms-transform: scale(1.0);
	-o-transform: scale(1.0);
	transform: scale(1.0);
}
body .bx-wrapper .bx-pager.bx-default-pager a.active {
	background-color: #ffd119;
}


.main-header > *,
.main-header2 > * {
    background-image: url(../img/common/wave_main_under_white.png);
}
.main-header2 > *.bg-img-yellow {
    background-image: url(../img/common/wave_main_under_yellow.png);
}
.main-header2 > *.bg-img-yellow-02 {
    background-image: url(../img/common/wave_main_under_yellow-02.png);
}
.home .main-header > *,
.home .main-header2 > * {
    background-image: none;
}
.home .main-area .mov-cover {
    padding: 0;
}
.home .main-area .mov-cover img {
    max-width: none;
    height: 100%;
}
.home .main-area #tubular-player {
    background-color: #ffffff;
}

.page-template-page-recruit_interview .main-header2 > *,
.page-template-page-philosophy_sustainability_policy .main-header2 > *,
.page-template-page-company_history .main-header2 > *,
.post-type-archive-jobs .main-header2 > *,
.page-template-page-brands .main-header2 > *,
.post-type-archive-activity .main-header2 > *,
.single-activity .main-header2 > *,
.page-template-page-recruit_interview .main-header2,
.page-template-page-contact .main-header2 > * {
    background-image: url(../img/common/wave_main_under_gray.png);
}

.page-template-page-recruit_message .main-img,
.single-fram-news .main-header2 > *,
.post-type-archive-fram-news .main-header2 > *,
.page-template-page-recruit_message .main-header > *,
.page-template-page-recruit_interview_01 .main-header > *,
.page-template-page-recruit_interview_02 .main-header > *,
.page-template-page-recruit_interview_03 .main-header > *,
.page-template-page-recruit_interview_04 .main-header > *,
.page-template-page-recruit_interview_05 .main-header > *,
.page-template-page-recruit_interview_06 .main-header > *,
.page-template-page-recruit_interview_07 .main-header > *,
.page-template-page-recruit_interview_08 .main-header > *,
.page-template-page-recruit_interview_09 .main-header > *,
.page-template-page-recruit_interview_10 .main-header > *,
.page-template-page-recruit_interview_11 .main-header > *,
.page-template-page-recruit_interview_12 .main-header > *,
.page-template-page-recruit_interview_13 .main-header > *,
.page-template-page-recruit_interview_14 .main-header > *,
.page-template-page-recruit_interview_15 .main-header > *,
.page-template-page-recruit_interview_16 .main-header > *,
.page-template-page-recruit_interview_17 .main-header > *,
.page-template-page-recruit_interview_18 .main-header > *,
.page-template-page-recruit_interview_19 .main-header > *,
.page-template-page-recruit_interview_20 .main-header > *,
.page-template-page-recruit_interview_21 .main-header > *,
.page-template-page-recruit_interview_22 .main-header > * {
    background-image: url(../img/common/wave_main_under_green.png);
}

/* 代表挨拶 */
.page-template-page-company_message .main-header,
.page-template-page-en-company_message .main-header {
    background-image: url(../img/company/message_main.jpg);
    background-position: center top;
}

/* インタビュー TOP */
.page-template-page-recruit_interview .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}

/* インタビュー01 */
.page-template-page-recruit_interview_01 .main-header {
    background-image: url(../img/interview/detail01_main.jpg);
}

/* インタビュー02 */
.page-template-page-recruit_interview_02 .main-header {
    background-image: url(../img/interview/detail02_main.jpg);
}

/* インタビュー03 */
.page-template-page-recruit_interview_03 .main-header {
    background-image: url(../img/interview/detail03_main.jpg);
}

/* インタビュー04 */
.page-template-page-recruit_interview_04 .main-header {
    background-image: url(../img/interview/detail04_main.jpg);
}

/* インタビュー05 */
.page-template-page-recruit_interview_05 .main-header {
    background-image: url(../img/interview/detail05_main.jpg);
}

/* インタビュー06 */
.page-template-page-recruit_interview_06 .main-header {
    background-image: url(../img/interview/detail06_main.jpg);
}

/* インタビュー07 */
.page-template-page-recruit_interview_07 .main-header {
    background-image: url(../img/interview/detail07_main.jpg);
}

/* インタビュー08 */
.page-template-page-recruit_interview_08 .main-header {
    background-image: url(../img/interview/detail08_main.jpg);
}

/* インタビュー09 */
.page-template-page-recruit_interview_09 .main-header {
    background-image: url(../img/interview/detail09_main.jpg);
}

/* インタビュー10 */
.page-template-page-recruit_interview_10 .main-header {
    background-image: url(../img/interview/detail10_main.jpg);
}

/* インタビュー11 */
.page-template-page-recruit_interview_11 .main-header {
    background-image: url(../img/interview/detail11_main.jpg);
}

/* インタビュー12 */
.page-template-page-recruit_interview_12 .main-header {
    background-image: url(../img/interview/detail12_main.jpg);
}

/* 環境方針 */
.page-template-page-philosophy_sustainability_policy .main-header2 {
    background-image: url(../img/sustainability/sustainability_main.jpg);
}
.page-template-page-philosophy_sustainability_policy .g-wrap-m h2 {
    margin-top: 30px;
}
.page-template-page-philosophy_sustainability_policy .g-wrap-m ul.list-disc2 li {
    background: url(../img/common/dot_02.png) 5px 10px no-repeat;
    background-size: 6px auto;
    padding: 0 0 0 20px;
    font-size: 14px;
}

/* 会社概要 */
.page-template-page-company_about .main-header2,
.page-template-page-en-company_about .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}

/* ネイチャーズウェイの歴史 */
.page-template-page-company_history .main-header2,
.page-template-page-en-company_history .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}

/* 求人 */
.single-jobs .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}
.post-type-archive-jobs .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}

/* News */
.blog .main-header2,
.single-post .main-header2,
.archive.category .main-header2,
.archive.tag .main-header2 {
    background-image: url(../img/news/news_main.jpg);
}

/* ブランド */
.page-template-page-brands .main-header2,
.page-template-page-en-brands .main-header2 {
    background-image: url(../img/brand/brand_main.jpg);
}

/* わたしたちの想い */
.page-template-page-philosophy .main-header2,
.page-template-page-en-philosophy .main-header2,
.page-template-page-company_philosophy .main-header2 {
    /*background-image: url(../img/common/wave_main_under_white.png), url(../img/philosophy/philosophy_main.jpg);*/
    background-image: url(../img/philosophy/philosophy_main.jpg);
}

/* 活動レポート */
.post-type-archive-activity .main-header2,
.single-activity .main-header2,
.post-type-archive-voice .main-header2,
.single-voice .main-header2 {
    background-image: url(../img/philosophy/activity_main.jpg);
}

/* 採用メッセージ（代表） */
.page-template-page-recruit_message .main-header {
    background-image: url(../img/recruit/message_main.jpg);
}

/* 農場だより */
.single-fram-news .main-header2,
.post-type-archive-fram-news .main-header2 {
    background-image: url(../img/philosophy/farm_main.jpg);
}

.page-template-page-philosophy_sustainability_reduce .main-header2 > *,
.page-template-page-philosophy_sustainability .main-header2 > *,
.page-template-page-company .main-header2 > *,
.page-template-page-company_business .main-header2 > *,
.page-template-page-en-brands .main-header2 > *,
.page-template-page-en-company .main-header2 > *,
.page-template-page-en-company_business .main-header2 > *,
.page-template-page-en-company_history .main-header2 > *,
.page-template-page-recruit_culture .main-header2 > * {
    background-image: url(../img/common/wave_main_under_white.png);
}

/* 環境負荷の軽減 */
.page-template-page-philosophy_sustainability_reduce .main-header2 {
    background-image: url(../img/sustainability/sustainability_main.jpg);
}
/* 環境保護の取り組み */
.page-template-page-philosophy_sustainability .main-header2 {
    background-image: url(../img/sustainability/sustainability_main.jpg);
}
/* 自然素材へのこだわり */
.page-template-page-philosophy_traceability .main-header2,
.page-template-page-en-philosophy_traceability .main-header2 {
    background-image: url(../img/philosophy/philosophy_main2.jpg);
}
/* ネイチャーズウェイとは */
.page-template-page-company .main-header2,
.page-template-page-en-company .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}
/* 事業案内 */
.page-template-page-company_business .main-header2,
.page-template-page-en-company_business .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}
/* 採用情報 */
.page-template-page-recruit .main-header2,
.page-template-page-recruit_entry .main-header2,
.page-template-page-recruit_entry_error .main-header2,
.page-template-page-recruit_entry_confirm .main-header2,
.page-template-page-recruit_entry_thank .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}
/* お問合せ */
.page-template-page-contact .main-header2,
.page-template-page-contact_confirm .main-header2,
.page-template-page-contact_error .main-header2,
.page-template-page-contact_thank .main-header2,
.page-template-page-en-contact .main-header2,
.page-template-page-en-contact_confirm .main-header2,
.page-template-page-en-contact_error .main-header2,
.page-template-page-en-contact_thank .main-header2 {
    background-image: url(../img/contact/contact_main.jpg);
}
/* 品質・安全性への取り組み */
.page-template-page-philosophy_quality .main-header2,
.page-template-page-en-philosophy_quality .main-header2 {
    background-image: url(../img/philosophy/philosophy_main2.jpg);
}
/* サイトマップ */
.page-template-page-sitemap .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}
/* ポリシー */
.page-template-page-policy .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}
/* 404 */
.error404 .main-header2 {
    background-image: url(../img/company/company_main.jpg);
}
/* 会社の魅力 */
.page-template-page-recruit_culture .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}
/* 教育カリキュラム */
.page-template-page-recruit_curriculum .main-header2 {
    background-image: url(../img/recruit/recruit_main.jpg);
}
/* 持続可能性 */
.main-header2.v-sustainability {
    background-image: url(../img/sustainability/sustainability_main.jpg);
}
/* 持続可能性 > 省エネ・再エネ */
/*
.main-header2.v-sustainability-energy {
    background-image: url(../img/sustainability/energy/sustainability_energy_main.jpg);
}
*/


.main-header-sp {
    -webkit-transition: opacity 0.25s ease 0.25s;
    -moz-transition: opacity 0.25s ease 0.25s;
    transition: opacity 0.25s ease 0.25s;
    opacity: 1;
}
.main-header-sp.inactive {
    opacity: 0;
}
.main-header-sp .slider li.inactive {
    opacity: 0;
}

@media screen and (max-width: 1499px) {
    /* home */
    .home .main-header h1,
    .home .main-header-sp h1 {
        font-size: 72px;
    }
    .home .main-header p,
    .home .main-header-sp p {
        font-size: 36px;
    }

    .home .main-header .sustainable-topic-area .sustainable-text {
        font-size: 24px;
    }

    .home .main-header,
    .home .main-header .mask {
        height: 586px;
    }
}

@media screen and (max-width: 1024px) {
    .home .main-header-sp {
/*
        background-image: url(../img/common/wave_main_under_white.png), url(../img/home/main.jpg);
        background-repeat: no-repeat, no-repeat;
        background-size: auto, cover;
        background-position: center bottom, center top;
        background-color: #000000;
        padding-top: 150px;
*/
    }

    body .bx-wrapper .bx-viewport .slider {
        background-image: url(../img/home/slide_01.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
     .home .main-header-sp > .animated {
        display: block;
        vertical-align: top;
        text-align: left;
        padding: 0;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        height: 240px;
    }
    .home .main-header-sp h1 {
        font-size: 34px;
        line-height: 1;
    }
    .home .main-header-sp p {
        font-size: 16px;
        margin: 30px 0 0 0;
    }

    .sustainable-topic-btn {
        display: block;
        font-size: 16px;
        margin: 0 auto;
    }

    .main-header-sp .wow {
		margin: auto;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		line-height: 1;
		height: 100px;
	}
    /* interview */
/*    .main-header{
        background-position: right top;
        height: 600px;
    }*/
}
@media screen and (max-width: 1023px) {
    .home .main-header .mask .animated {
        top: 140px;
        position: absolute;
        width: 100%;
    }

    .main-header {
        height: 600px;
        background-size: auto 400px;
        background-position: right top;
    }

    .page-template-page-recruit_interview_01 .main-header {
        background-position: left top;
    }

    .page-template-page-recruit_interview_03 .main-header,
    .page-template-page-recruit_interview_04 .main-header,
    .page-template-page-recruit_interview_05 .main-header,
    .page-template-page-recruit_interview_06 .main-header,
    .page-template-page-recruit_interview_07 .main-header,
    .page-template-page-recruit_interview_08 .main-header,
    .page-template-page-recruit_interview_09 .main-header,
    .page-template-page-recruit_interview_10 .main-header,
    .page-template-page-recruit_interview_11 .main-header,
    .page-template-page-recruit_interview_12 .main-header {
        background-position: top;
    }

    .main-header > * {
        padding-top: 400px;
    }
    .main-header > * {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: right top;
    }
    .main-header2 {
        height: 200px;
        width: 100%;
    }
    .main-header2 h1 {
        font-size: 50px;
    }
    .main-header2 p {
        font-size: 18px;
    }

    /* home */
/*
    .home .main-header-sp {
        height: 460px;
        padding-top: 150px;
    }
*/
    .home .main-header-sp,
    body .home .main-header-sp,
    body .bx-wrapper .bx-viewport .slider,
    body .bx-wrapper .bx-viewport li,
    body .slider li {
        height: 460px;
    }
    .home .main-header-sp h1 {
        font-size: 60px;
    }
    .home .main-header-sp p {
        font-size: 28px;
        margin-top: 20px;
    }

    .home .main-header-sp .sustainable-topic-area p {
        font-size: 20px;
        margin-top: 20px;
    }

    /* 代表挨拶 */
    .page-template-page-company_message .main-img,
    .page-template-page-en-company_message .main-img {
        background-image: url(../img/company/message_main.jpg);
        background-position: 70% top;
    }

    /* インタビュー01 */
    .page-template-page-recruit_interview_01 .main-img {
        background-image: url(../img/interview/detail04_main.jpg);
    }

    /* インタビュー02 */
    .page-template-page-recruit_interview_02 .main-img {
        background-image: url(../img/interview/detail05_main.jpg);
    }

    /* インタビュー03 */
    .page-template-page-recruit_interview_03 .main-img {
        background-image: url(../img/interview/detail06_main.jpg);
    }

    /* インタビュー04 */
    .page-template-page-recruit_interview_04 .main-img {
        background-image: url(../img/interview/detail03_main.jpg);
    }

    /* インタビュー05 */
    .page-template-page-recruit_interview_05 .main-img {
        background-image: url(../img/interview/detail01_main.jpg);
    }

    /* インタビュー06 */
    .page-template-page-recruit_interview_06 .main-img {
        background-image: url(../img/interview/detail02_main.jpg);
    }

    /* 採用メッセージ（代表） */
    .page-template-page-recruit_message .main-header {
            height: 570px;
    }
    .page-template-page-recruit_message .main-img {
        background-image: url(../img/recruit/message_main.jpg);
    }
}

@media screen and (max-width: 639px) {
    .main-header {
        height: 416px;
        background-size: auto 240px;
    }
    .main-header > * {
        padding-top: 240px;
    }
    .main-header2 {
        height: 100px !important;
    }
    .main-header2 h1 {
        font-size: 28px;
    }
    .main-header2 p {
        font-size: 11px;
    }
    .main-header2 p.base {
        margin-top: 10px;
    }

    /* home */
/*
    .home .main-header-sp {
        height: 240px;
        padding-top: 30px;
        display: block;
    }
*/
    .home .main-header-sp,
    body .home .main-header-sp,
    body .bx-wrapper .bx-viewport .slider,
    body .bx-wrapper .bx-viewport li,
    body .slider li {
        height: 400px;
    }

    body .bx-wrapper .bx-viewport .slider {
        background-image: url(../img/home/slide_01.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
/*
    .home .main-header-sp > div {
        display: block;
        vertical-align: top;
        text-align: left;
        padding: 0 0 0 30px;
    }
*/
/*    .home .main-header-sp > .animated {
        display: block;
        vertical-align: top;
        text-align: left;
        padding: 0;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        height: 100px;
    }*/
    .home .main-header-sp h1 {
        font-size: 34px;
    }
    .home .main-header-sp p {
        font-size: 16px;
    }

    .home .main-header-sp .sustainable-text,
    .home .main-header-sp .sustainable-topic-btn {
        font-size: 14px !important;
        width: 100%;
    }

    .page-template-page-recruit_message .main-header {
            height: 410px;
    }
}



/*
   announcement
------------------------------ */
.announcement {
    border: 1px solid #c4c4c4;
    border-radius: 3px;
    padding: 20px 30px;
    display: table;
    width: 100%;
    margin: 0 0 100px 0;
    background: rgba(255,255,255,0.70);
    position: relative;
}
.announcement dt {
    display: table-cell;
    padding: 0 35px 0 30px;
    width: 130px;
    background: url(../img/common/icon_bell.png) 0 7px no-repeat;
    background-size: 14px auto;
}
.announcement dd {
    display: table-cell;
    border-left: 1px solid #c4c4c4;
    padding: 0 0 0 35px;
}
.announcement dd span {
    padding: 0 10px 0 0;
}
.announcement a {
    text-decoration: underline;
}
.announcement a:hover {
    text-decoration: none;
}

@media screen and (max-width: 639px) {
    .announcement {
        padding: 20px;
        display: block;
        margin: 0 0 40px 0;
    }
    .announcement dt {
        display: block;
        padding: 0 0 0 30px;
        width: 100%;
    }
    .announcement dd {
        display: block;
        border-left: none;
        padding: 0;
    }
}


/*
   main profile
------------------------------ */
.profile-right-10 {
    right: 10% !important;
}

.profile-left-10 {
    left: 10% !important;
}

.profile-left-5 {
    left: 5% !important;
}

.profile,
.profile-03 {
    position: absolute;
    top: 80px;
    width: 500px;
    height: 440px;
    background: rgba(66,145,162,0.80);
    display: table;
}
.profile-03 {
    width: 550px;
}
.profile-inner {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #ffffff;
}
.profile-inner h1 {
   font-size: 34px;
   line-height: 1.3;
   letter-spacing: 0.075em;
}
.profile-inner h1 + span {
    width: 160px;
    height: 2px;
    display: block;
    margin: 40px auto 30px;
    background: #ffffff;
}
.profile-inner .info {
    line-height: 1.3;
}
.profile-inner .name {
    font-family: serif;
    font-size: 24px;
}

.profile-02 {
    position: absolute;
    left: 15%;
    top: 170px;
}

/* .page-template-page-en-company_message .profile-02 {
    width: 40%;
} */

.profile-02 .profile-inner {
    text-align: left;
    color: #333333;
}
.profile-02 .profile-inner h1 {
   font-size: 40px;
   line-height: 1.5;
   letter-spacing: 0.075em;
}
.profile-02 .profile-inner h1 + span {
    width: 160px;
    height: 2px;
    display: block;
    margin: 40px 0 30px 0;
    background: #333333;
}
.profile-02 .profile-inner .info {
    line-height: 1.3;
    font-size: 20px;
}
.profile-02 .profile-inner .name {
    font-family:"ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "メイリオ" , Meiryo , serif;
    font-size: 26px;
}

.profile-04 {
    position: absolute;
    left: 20%;
    top: 160px;
    height: 340px;
    display: table;
}
.profile-04 .profile-inner {
    display: table-cell;
    text-align: left;
    vertical-align: middle;
}
.profile-04 .profile-inner h1 {
   font-size: 40px;
   line-height: 1.5;
   letter-spacing: 0.075em;
   text-shadow:0 0 16px #153b33;
}
.profile-04 .profile-inner-name {
   background: rgba(66,145,162,0.80);
   padding: 20px 50px;
   display:inline-block;
   margin-top: 130px;
}
.profile-04 .profile-inner-name .info {
    font-size: 20px;
    line-height: 1;
}
.profile-04 .profile-inner-name .name {
    font-size: 26px;
    line-height: 1;
    padding-top:10px;
}

@media screen and (max-width: 1499px) {
    .profile-02 {
        left: 5%;
    }

    /* .page-template-page-en-company_message .profile-02 {
        width: 50%;
    } */

    .profile-02 .profile-inner h1 {
       font-size: 34px;
    }

    .profile-04 {
        left: 12%;
    }
    .profile-04 .profile-inner h1 {
       font-size: 34px;
    }
}

@media screen and (max-width: 1023px) {
    .profile,
    .profile-02,
    .profile-03 {
        position: inherit;
        left: auto;
        top: auto;
        width: 100%;
        height: inherit;
        display: block;
        background: rgba(84,159,175,1.00);
        padding: 20px 0;
    }
    .profile-02 {
        height: auto;
        background: #dff0f4;
    }
    /* .page-template-page-en-company_message .profile-02 {
        width: 100%;
    } */
    .profile-inner,
    .profile-02 .profile-inner {
        display: block;
        text-align: center;
        color: #ffffff;
    }
    .profile-02 .profile-inner {
        color: inherit;
    }
    .profile-inner h1,
    .profile-02 .profile-inner h1 {
       font-size: 24px;
    }
    .profile-inner h1 + span,
    .profile-02 .profile-inner h1 + span {
        width: 120px;
        height: 1px;
        margin: 20px auto 20px;
    }
    .profile-inner .name,
    .profile-02 .profile-inner .name {
        font-size: 18px;
    }

    .profile-04 {
        position: inherit;
        left: auto;
        top: auto;
        width: 100%;
        height: inherit;
        display: block;
        background: rgba(84,159,175,1.00);
        padding: 20px 0;
    }
    .profile-04 .profile-inner {
        text-align: center;
        display:block;
        padding:0 20px;
    }
    .profile-04 .profile-inner h1 {
       font-size: 30px;
       text-shadow: none;
    }
    .profile-04 .profile-inner-name {
       background: none;
       padding: 0;
       display: block;
       margin-top: 30px;
    }
    .profile-04 .profile-inner-name .info {
        font-size: 18px;
    }
    .profile-04 .profile-inner-name .name {
        font-size: 20px;
    }
}

@media screen and (max-width: 639px) {
    .profile {
        padding: 20px 0;
        height: 100%;
    }
    .profile-inner h1 {
       font-size: 20px;
    }
    .profile-inner h1 + span {
        width: 80px;
        margin: 10px auto;
    }
    .profile-inner .info {
        font-size: 10px;
    }
    .profile-inner .name {
        font-size: 14px;
    }

    .profile-02 .profile {
        padding: 20px 0;
    }
    .profile-02 .profile-inner h1 {
       font-size: 20px;
    }
    .profile-02 .profile-inner h1 + span {
        width: 80px;
        margin: 10px auto;
    }
    .profile-02 .profile-inner .info {
        font-size: 10px;
    }
    .profile-02 .profile-inner .name {
        font-size: 14px;
    }

    .profile-04 .profile-inner h1 {
       font-size: 16px;
    }
    .profile-04 .profile-inner-name .info {
        font-size: 10px;
    }
    .profile-04 .profile-inner-name .name {
        font-size: 14px;
    }
}


/*
   interview contents
------------------------------ */
.interview-con {
    position: relative;
}
.interview-con + .interview-con {
    margin: 120px 0 0 0;
}
.interview-con .img {
    position: relative;
}
.interview-con .text {
    position: relative;
    width: 700px;
    margin: -50px 0 0 50px;
    padding: 60px 30px;
    background: #ffffff;
    border-radius: 5px;
}
.interview-con .text h1 {
    font-size: 24px;
    line-height: 1.3;
    margin: 0 0 25px 0;
    letter-spacing: 0.075em;
}

.interview-con.con02 .img {
    text-align: right;
    margin: 0 -60px 0 0;
}
.interview-con.con02 .text {
    width: 570px;
    margin: -330px 0 0 0;
}

.interview-con.con03 .img {
    margin: 0 0 0 -100px;
}
.interview-con.con03 .text {
    width: 570px;
    margin: -120px 0 0 400px;
}

.schedule {
    background: url(../img/interview/detail_dot_time.png) 27px top repeat-y;
}
.schedule li {
    display: table;
    width: 100%;
    min-height: 58px;
}
.schedule li + li {
    margin: 30px 0 0 0;
}
.schedule li > div {
    display: table-cell;
    vertical-align: middle;
}
.schedule li .time {
    background: url(../img/interview/detail_bg_time.png) left top no-repeat;
    width: 58px;
    text-align: center;
    color: #2e8598;
    vertical-align: top;
    padding: 15px 0 0 0;
    height: 58px;
}
.schedule li .text div {
    padding: 0 0 0 40px;
    line-height: 1.3;
}
.schedule li .text span {
    display: block;
    font-size: 18px;
    font-weight: bold;
}
.schedule li .text span + span {
    display: block;
    font-size: 16px;
    font-weight: normal;
}

@media screen and (max-width: 1023px) {
    .interview-con + .interview-con {
        margin: 80px 0 0 0;
    }

    .interview-con .text {
        width: 80%;
    }

    .interview-con.con02 .text {
        width: 80%;
        margin: -50px 0 0 0;
    }

    .interview-con.con03 .text {
        width: 80%;
        margin: -50px 0 0 0;
    }
}

@media screen and (max-width: 639px) {
    .interview-con + .interview-con {
        margin: 50px 0 0 0;
    }
    .interview-con .text {
        position: relative;
        width: 100%;
        margin: 0;
        padding: 20px 0;
    }
    .interview-con .text h1 {
        font-size: 18px;
        margin: 0 0 10px 0;
        line-height: 1.5;
    }

    .interview-con.con02 .img {
        text-align: left;
        margin: 0;
    }
    .interview-con.con02 .text {
        width: 100%;
        margin: 0;
    }

    .interview-con.con03 .img {
        margin: 0;
    }
    .interview-con.con03 .text {
        width: 100%;
        margin: 0;
    }

    .schedule {
        background: url(../img/interview/detail_dot_time.png) 19px top repeat-y;
    }
    .schedule li {
        min-height: 40px;
    }
    .schedule li .time {
        background-size: 40px auto;
        font-size: 12px;
        width: 40px;
        padding: 10px 0 0 0;
        height: 40px;
    }
    .schedule li .text div {
        padding: 0 0 0 20px;
    }
    .schedule li .text span {
        font-size: 14px;
    }
    .schedule li .text span + span {
        font-size: 12px;
    }
}


/*
   interview slider
------------------------------ */
.interview-slider {
    max-width: 1600px;
    margin: 0 auto;
}
.interview-slider li {
    position: relative;
}
.interview-slider a {
    display: block;
}
.interview-slider .hover {
    display: none;
}
.interview-slider a:hover .hover {
    position: absolute;
    left: 0;
    top: 0;
    display: table;
    width: 100%;
    background-image: url(../img/interview/slider_bg_herb.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-color: rgba(46,133,152,0.86);
}
.interview-slider .hover-inner {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: #ffffff;
}
.interview-slider .hover-inner span {
    display: block;
}
.interview-slider .hover-inner .category {
    font-size: 26px;
    line-height: 1.3;
}
.interview-slider .hover-inner .category span {
    font-size: 20px;
    margin-bottom: 5px;
}
.interview-slider .hover-inner .years {
    font-size: 20px;
}
.interview-slider .hover-inner .more {
    font-size: 20px;
    margin: 30px 0 0 0;
}

@media screen and (max-width: 1499px) {
    .interview-slider .hover-inner .category {
        font-size: 20px;
    }
    .interview-slider .hover-inner .years {
        font-size: 18px;
    }
    .interview-slider .hover-inner .more {
        font-size: 18px;
    }
}

@media screen and (max-width: 639px) {
    .interview-slider a:hover .hover {
        background-size: 40px auto;
    }
    .interview-slider .hover-inner .category {
        font-size: 16px;
    }
    .interview-slider .hover-inner .years {
        font-size: 12px;
    }
    .interview-slider .hover-inner .more {
        font-size: 12px;
        margin: 20px 0 0 0;
    }
}



/*
   link btn
------------------------------ */
.link-btn {
    margin-left: -20px;
    margin-top: -15px;
}
.link-btn li {
    float: left;
    width: 33.33333%;
    font-size: 18px;
    padding: 15px 0 0 20px;
    line-height: 1;
}
.link-btn li a {
    display: block;
    background: #e7f4f7;
    border: 1px solid #645d5b;
    border-radius: 4px;
    text-align: center;
    padding: 40px 0;
}
.link-btn li a:hover,
.link-btn li.active a,
.link-btn li.current a {
    background-color: #549faf;
    border-color: #549faf;
    color: #ffffff;
}

.link-btn-02 a {
    color: #ffffff;
}
.link-btn-02 dl {
    position: relative;
    text-align: center;
    height: 160px;
}
.link-btn-02 dt {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 160px;
    border-radius: 4px;
}
.link-btn-02 dd {
    position: absolute;
    left: 0;
    top: 0;
    display: table;
    width: 100%;
    height: 160px;
    font-size: 30px;
    font-weight: bold;
    text-shadow: 0 0 4px #040000;
    line-height: 1.6;
}
.link-btn-02 dd div {
    display: table-cell;
    vertical-align: middle;
}


.link-btn-03 a {
    color: #ffffff;
}
.link-btn-03 dl {
    position: relative;
    text-align: center;
    height: 220px;
}
.link-btn-03 dt {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 220px;
    border-radius: 7px;
}
.link-btn-03 dd {
    position: absolute;
    left: 0;
    top: 0;
    display: table;
    width: 100%;
    height: 220px;
    font-size: 26px;
    line-height: 1.5;
    text-shadow: 0 0 4px #040000;
}
.link-btn-03 dd div {
    display: table-cell;
    vertical-align: middle;
}
.link-btn-03 dd .more {
    font-size: 22px;
}
.hover-arrow {
    vertical-align: sub;
}

.back-link a {
    display: inline-block;
    border-radius: 4px;
    font-size: 16px;
    padding: 0 20px 0 32px;
    background-color: #e1eee4;
    line-height: 2.5;
    margin-bottom: 30px;
}
.back-link-02 a {
    display: inline-block;
    font-size: 16px;
    padding: 0 0 0 12px;
    line-height: 2.5;
    margin-bottom: 30px;
}

.link-btn-05 {
    border-top: 4px solid #ffffff;
}
.link-btn-05 .col:first-child {
    border-right: 2px solid #ffffff;
}
.link-btn-05 .col:last-child {
    border-left: 2px solid #ffffff;
}
.link-btn-05 a {
    position: relative;
    display: block;
}
.link-btn-05 .img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 350px;
}
.link-btn-05 .text {
    z-index: 1000;
    display: table;
    width: 100%;
    height: 350px;
    position: relative;
}
.link-btn-05 .text div {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.link-btn-05 .text div ul {
    background: rgba(84,159,175,0.80);
    color: #ffffff;
    width: 420px;
    padding: 26px 0;
    margin: 0 auto;
}
.link-btn-05 .text div ul .text-01 {
    font-size: 30px;
    font-weight: bold;
}
.link-btn-05 .text div ul .text-02 {
    font-size: 20px;
    margin-top: 0;
}

@media screen and (max-width: 1023px) {
    .link-btn li {
        font-size: 14px;
    }
    .link-btn li a {
        padding: 30px 0;
    }

    .link-btn-02 dl {
        height: 120px;
    }
    .link-btn-02 dt {
        height: 120px;
    }
    .link-btn-02 dd {
        height: 120px;
        font-size: 28px;
        line-height: 1.2;
    }
    .link-btn-02 dd img {
        width: 32px;
    }

    .link-btn-03 dl {
        height: 180px;
    }
    .link-btn-03 dt {
        height: 180px;
    }
    .link-btn-03 dd {
        height: 180px;
        font-size: 22px;
        line-height: 1.4;
    }
    .link-btn-03 dd .more {
        font-size: 18px;
    }

    .back-link a {
        font-size: 12px;
        padding: 5px 20px 5px 32px;
        line-height: 1.8;
    }

    .link-btn-05 .img {
        height: 300px;
    }
    .link-btn-05 .text {
        height: 300px;
    }
    .link-btn-05 .text div ul {
        width: 70%;
    }
    .link-btn-05 .text div ul .text-01 {
        font-size: 20px;
    }
    .link-btn-05 .text div ul .text-02 {
        font-size: 14px;
        margin-top: 0;
    }
}

@media screen and (max-width: 639px) {
    .link-btn {
        margin-left: -10px;
        margin-top: -10px;
    }
    .link-btn li {
        width: 50%;
        font-size: 12px;
        padding: 10px 0 0 10px;
    }
    .link-btn li a {
        padding: 20px 0;
    }

    .link-btn-02 dl {
        height: 80px;
    }
    .link-btn-02 dt {
        height: 80px;
    }
    .link-btn-02 dd {
        height: 80px;
        font-size: 18px;
    }
    .link-btn-02 dd img {
        width: 24px;
    }

    .link-btn-03 dl {
        height: 120px !important;
    }
    .link-btn-03 dt {
        height: 120px !important;
    }
    .link-btn-03 dd {
        height: 120px !important;
        font-size: 18px;
    }
    .link-btn-03 dd .more {
        font-size: 16px;
    }

    .link-btn-05 .col:first-child,
    .link-btn-05 .col:last-child {
        border-right: none;
        border-left: none;
    }
    .link-btn-05 .col:last-child {
        border-top: 4px solid #ffffff;
    }
    .link-btn-05 .img {
        height: 240px;
    }
    .link-btn-05 .text {
        height: 240px;
    }
    .link-btn-05 .text div ul .text-01 {
        font-size: 18px;
    }
}



/*
   list
------------------------------ */

.list-decimal {
    list-style: decimal;
    padding-left: 20px;
}
.list-decimal > li {
    padding-left: 12px;
}
.list-decimal > li + li {
    margin-top: 28px;
}
.list-decimal ul {
    list-style: disc;
    padding-left: 20px;

}
.list-decimal ul li {
    margin-top: 7px;
}

.list-disc {
    padding: 40px;
    list-style: disc;
    border-bottom: 1px solid #e8e6cf;
    border-top: 1px solid #e8e6cf;
}
.list-disc > li + li {
    margin-top: 20px;
}

.list-disc2 {
    margin: 10px 0 0 0;
}
.list-disc2 li {
    background: url(../img/common/dot_02.png) 5px 8px no-repeat;
    background-size: 6px auto;
    padding: 0 0 0 20px;
    font-size:12px;
}

.list-disc3 {
    padding: 20px 20px 20px 40px;
    list-style: disc;
}
.list-disc3 > li + li {
    margin-top: 10px;
}

.list-radius {
    list-style: none;
    margin-top: -10px;
    margin-left: -8px;
}
.list-radius li {
    border: 1px solid #afafaf;
    border-radius: 30px;
    display: inline-block;
    padding: 5px 20px;
    margin-top: 10px;
    margin-left: 8px;
}

@media (max-width: 639px) {
    .list-decimal > li {
        padding-left: 6px;
    }
    .list-decimal > li + li {
        margin-top: 14px;
    }

    .list-disc {
        padding: 20px 0 20px 20px;
    }
    .list-disc > li + li {
        margin-top: 14px;
    }

    .list-disc3 {
        padding: 20px 0 20px 20px;
    }
    .list-disc3 > li + li {
        margin-top: 10px;
    }

    .list-radius {
        list-style: none;
        margin-left: -5px;
    }
    .list-radius li {
        border: 1px solid #afafaf;
        border-radius: 30px;
        display: inline-block;
        margin-left: 5px;
    }
}



/*
   thumbnail list
------------------------------ */
.thumbnail-list {
    text-align: center;
}
.thumbnail-list dl {
    position: relative;
    margin-top: 20px;
}
.thumbnail-list dl dt {
    position: absolute;
    left: 0;
    top: 0;
}
.thumbnail-list dl dd {
    z-index: 1000;
    display: table;
    width: 100%;
    height: 220px;
    position: relative;
}
.thumbnail-list dl dd div {
    display: table-cell;
    vertical-align: middle;
}
.thumbnail-list dl dd div ul {
    width: 80%;
    margin: 0 auto;
    padding: 20px 0;
    background: rgba(84,159,175,0.80);
    color: #ffffff;
    line-height: 1.5;
}
.thumbnail-list .text-01 {
    font-size: 20px;
    font-weight: bold;
}
.thumbnail-list .text-02 {
    font-size: 16px;
}

.thumbnail-list-02 {
}
.thumbnail-list-02 .col {
    position: relative;
    margin-top: 5% !important;
}
.thumbnail-list-02 .img {
    display: block;
    height: 220px;
    border-radius: 7px;
}
.thumbnail-list-02 .cate,
.cat-id-1,.cat-id-2,.cat-id-3,.cat-id-4,.cat-id-5,.cat-id-6,.cat-id-7,.cat-id-8,.cat-id-9 {
    position: absolute;
    top: 10px;
    right: 10px;
    display: inline-block;
    border-radius: 3px;
    color: #ffffff;
    padding: 0 15px;
    font-size: 12px;
}
.blog-con .info .cate {
    display: inline-block;
    border-radius: 3px;
    color: #ffffff;
    padding: 0 15px;
    font-size: 12px;
}
.cate.sanders-perry,
.brand .sanders-perry,
.cat-id-1 {
    background-color: #0a57b2 !important;
}
.cate.weleda,
.brand .weleda,
.cat-id-2 {
    background-color: #5965a5 !important;
}
.cate.naturaglace,
.brand .naturaglace,
.cat-id-3 {
    /*background-color: #a65838 !important;*/
    background-color: #b97a59 !important;
}
.cate.naturaglace-nu,
.brand .naturaglace-nu,
.cat-id-4 {
    background-color: #9796a5 !important;
}
.cate.chant-a-charm,
.brand .chant-a-charm,
.cat-id-5 {
    background-color: #24a178 !important;
}
.cate.biolab,
.brand .biolab,
.cat-id-6 {
    background-color: #94bd69 !important;
}
.cate.beauty-library,
.brand .beauty-library,
.cat-id-7 {
    background-color: #cb94bb !important;
}
.cate.natures-way,
.brand .natures-way,
.cat-id-8 {
    background-color: #549faf !important;
}
.cate.info,
.brand .info,
.cat-id-9 {
    background-color: #549faf !important;
}
.cate.dr-bronners,
.brand .dr-bronners,
.cat-id-10 {
    background-color: #144189 !important;
}
.cate.fram-news{
    background-color: #97b360 !important;
}
.brand .labo,
.cate.labo{
    background-color: #5696ce !important;
}
.brand .oofer,
.cate.oofer{
    background-color: #8C7D79 !important;
}

.brand .head-nagoya, .brand .branch-tokyo, .brand .office-nagoya {
    background-color: #549faf !important;
}
.thumbnail-list-02 .external-site-url {
    position: absolute;
    top: 183px;
    right: 10px;
}
.thumbnail-list-02 .date {
    display: block;
    font-size: 13px;
    margin: 10px 0 0 0;
    font-weight: 400;
}
.thumbnail-list-02 .date .new {
    color: #f54444;
    font-size: 13px;
    display: inline;
    margin-left: 10px;
}
.thumbnail-list-02 .title {
    display: block;
    font-size: 14px;
    line-height: 1.4;
    margin: 5px 0 0 0;
}
.thumbnail-list-02 a:hover .title {
    text-decoration: underline;
}
.thumbnail-list-02 .title-02 {
    font-size: 18px;
    margin: 30px 0 0 0;
    font-weight: bold;
    display: block;
    line-height: 1.3;
}
.page-template-page-recruit_welfare .thumbnail-list-02 p {
    margin: 20px 0 0 0;
}

.thumbnail-list-03 {
    text-align: center;
    font-size: 0;
}
.thumbnail-list-03 li {
    display: inline-block;
    width: 30.66%;
    margin: 0 0 0 3.90%;
}
.thumbnail-list-03 li:first-child {
    margin: 0;
}
.thumbnail-list-03 dl {
    position: relative;
}
.thumbnail-list-03 dt {
    height: 180px;
    border-radius: 7px;
}
.thumbnail-list-03 dd {
    position: absolute;
    left: 0;
    top: 0;
    display: table;
    width: 100%;
    height: 180px;
    background: rgba(132,98,32,0.24);
    border-radius: 7px;
}
.thumbnail-list-03 dd span {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    color: #ffffff;
    text-shadow: rgba(0,0,0,0.15) 0 0 4px;
    font-size: 26px;
    font-weight: bold;
    line-height: 1.3;
}

.philosophy-thumbnail-list {
    text-align: center;
}
.philosophy-thumbnail-list dl {
    position: relative;
    margin-top: 40px;
}
.philosophy-thumbnail-list dl dt {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 220px;
    border-radius: 7px;
}
.page-template-page-philosophy .philosophy-thumbnail-list dl dt {
    height: 310px;
}
.philosophy-thumbnail-list dl dd {
    z-index: 1000;
    display: table;
    width: 100%;
    height: 310px;
    position: relative;
}
.home .philosophy-thumbnail-list dl dd {
    height: 220px;
}
.philosophy-thumbnail-list dl dd div {
    display: table-cell;
    vertical-align: middle;
}
.philosophy-thumbnail-list dl dd div ul {
    width: 80%;
    margin: 0 auto;
    padding: 20px 10px;
    background: rgba(84,159,175,0.80);
    color: #ffffff;
    line-height: 1.5;
}
.philosophy-thumbnail-list .text-01 {
    font-size: 22px;
    font-weight: bold;
}
.philosophy-thumbnail-list .text-02 {
    font-size: 14px;
    font-weight: normal;
}
.philosophy-thumbnail-list .text-03 {
    font-size: 16px;
    margin-top: 16px;
}

.cate.report,
.brand .report,
.cat-id-10 {
    background-color: #2e8598 !important;
    font-size: 12px;
}

@media screen and (max-width: 1023px) {
    .thumbnail-list .text-01 {
        font-size: 18px;
    }
    .thumbnail-list .text-02 {
        font-size: 18px;
    }

    .thumbnail-list-03 dt {
        height: 150px !important;
    }
    .thumbnail-list-03 dd {
        height: 150px;
    }
    .thumbnail-list-03 dd span {
        font-size: 18px;
    }

    .philosophy-thumbnail-list dl dt {
        height: 157px;
    }
    .philosophy-thumbnail-list dl {
        position: relative;
        margin-top: 30px;
    }
    .page-template-page-philosophy .philosophy-thumbnail-list dl dt {
        height: 220px;
    }
    .philosophy-thumbnail-list dl dd {
        height: 220px;
    }
    .home .philosophy-thumbnail-list dl dd {
        height: 157px;
    }
    .philosophy-thumbnail-list .text-01 {
        font-size: 18px;
    }
    .home .philosophy-thumbnail-list .text-01 {
        font-size: 14px;
    }
    .philosophy-thumbnail-list .text-02 {
        font-size: 13px;
    }
    .philosophy-thumbnail-list .text-03 {
        font-size: 16px;
        margin-top: 10px;
    }
}

@media screen and (max-width: 767px) {
    .philosophy-thumbnail-list .text-02 {
        font-size: 11px;
    }
    .philosophy-thumbnail-list .heading-02 h2 {
        font-size: 20px;
    }

    .thumbnail-list-03 dt {
        height: 130px !important;
    }
    .thumbnail-list-03 dd {
        height: 130px;
    }
    .thumbnail-list-03 dd span {
    }
}

@media screen and (max-width: 639px) {
    .thumbnail-list {
        line-height: 1.5;
    }
    .thumbnail-list .text-01 {
        font-size: 16px;
        margin: 5px 0 0 0;
    }
    .thumbnail-list .text-02 {
        font-size: 16px;
    }

    .philosophy-thumbnail-list dl {
        margin-top: 20px;
    }
    .philosophy-thumbnail-list dl dt {
        position: relative;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }
    .philosophy-thumbnail-list dl dt img {
        border-radius: 7px 7px 0 0 !important;
    }
    .philosophy-thumbnail-list dl dd {
        height: auto !important;
        display: block;
    }
    .home .philosophy-thumbnail-list .text-01 {
        font-size: 18px;
    }
    .philosophy-thumbnail-list .text-02 {
        font-size: 13px;
    }
    .philosophy-thumbnail-list dl dd div {
        display: block;
        vertical-align: middle;
    }
    .philosophy-thumbnail-list dl dd div ul {
        width: 100%;
        padding: 20px 10px;
        background: rgba(84,159,175,1.00);
        border-radius: 0 0 7px 7px;
    }

    .thumbnail-list-02 .col {
        margin-top: 12% !important;
    }
    .thumbnail-list-02 .title-02 {
        margin: 20px 0 0 0;
        font-weight: bold;
    }
    .page-template-page-recruit_welfare .thumbnail-list-02 .col + .col {
        margin-top: 20px;
        padding-top: 25px;
        border-top: 1px solid #afafaf;
    }
    .page-template-page-recruit_welfare .thumbnail-list-02 p {
        margin: 10px 0 0 0;
    }

    .thumbnail-list-03 li {
        display: inline-block;
        width: 100%;
        margin: 0 0 0 0;
    }
    .thumbnail-list-03 li + li {
        margin: 20px 0 0 0;
    }
    .thumbnail-list-03 dt {
        height: 130px !important;
    }
    .thumbnail-list-03 dd {
        height: 130px;
    }
    .thumbnail-list-03 dd span {
        font-size: 18px;
    }
}



/*
   thumbnail
------------------------------ */
.thumbnail {
	display: block;
	position: relative;
    z-index: 1;
}
.thumbnail + *,
.thumbnail + * + *,
.thumbnail + * + * + *,
.thumbnail + * + * + * + * {
    z-index: 2;
}
.thumbnail > *  {
	margin: auto;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.thumbnail {
	/*margin: auto;*/
	/*max-width: 100%;*/
	box-sizing: border-box;
	overflow: hidden;
}
.thumbnail > * {
	/*line-height: 1;*/
	/*text-align: center;*/
}
.thumbnail > img {
	max-width: none;
	max-width: initial;
	max-height: none;
	max-height: initial;
    /* transition: all 0.5s ease 0s; */
    transition: opacity 0.5s ease 0s,
                transform 0.5s ease 0s;
	/*opacity: 0;*/
}
.thumbnail > img {
    opacity: 0;
}
.thumbnail.landscape > img,
.thumbnail.portrait > img {
    opacity: 1;
}
a:hover .thumbnail img {
    transform: scale(1.1);
}
.thumbnail.landscape > img {
	max-width: none;
	max-width: initial;
	max-height: 100%;

	height: 100%;
	left: 50%;
	right: auto;
}
.thumbnail.portrait > img {
	max-width: 100%;
	max-height: auto;
	max-height: initial;

	width: 100%;
	top: 50%;
	bottom: auto;
}
.thumbnail.contain.landscape > img,
.thumbnail.contain.portrait > img,
.thumbnail.contain > img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
/* ↓.containのとき、横幅(縦幅)が足りないときに無理やり横幅100%にする必要がある場合(なければコメントアウト) */
/*.thumbnail.contain.landscape > img {
	width: 100%;
	height: auto;
}
.thumbnail.contain.portrait > img {
	width: auto;
	height: 100%;
}*/
/* ↑.containのとき、横幅(縦幅)が足りないときに無理やり横幅100%にする必要がある場合(なければコメントアウト) */



/*
   table
------------------------------ */

.table,
.blog-content table {
    border-collapse: collapse;
    border-bottom: 1px solid #e6e6e6;
    width: 100%;
}
.blog-content table {
    margin-top: 70px;
}
.table th,
.table td,
.blog-content table th,
.blog-content table td {
    vertical-align:top;
    text-align:left;
    border-top: 1px solid #e6e6e6;
    padding: 30px 20px;
}
.blog-content table th {
    width: 200px;
}
.table td,
.blog-content table td  {
    padding-left: 0;
}

.table .company-name {
    font-size: 18px;
    display: block;
    font-weight: bold;
    line-height: 1.6;
}
.table .company-name2 {
    font-size: 16px;
    display: block;
}
.table .company-site {
    display: block;
    word-break: break-all;
    margin-top: 5px;
}
.table .company-site img {
    vertical-align: middle;
    margin-right: 7px;
}
.table a {
    color: #549faf;
}

@media (max-width: 639px) {
    .table th,
    .table td {
        width: 100%;
        display:block;
        padding:15px 5px 10px;
    }
    .blog-content table th {
        width: 30%;
    }
    .table td {
        border-top: none;
        padding-top: 0;
        padding-bottom: 15px;
    }
    .table .company-name2 {
        margin-top: 0;
    }
}



/*
   padding グレーの囲み・左右のパディング
------------------------------ */
.contents-pa-radius {
    padding: 80px 60px !important;
    border-radius: 7px;
}
.contents-pa-radius.v-none {
    padding: 80px 0 !important;
}

@media screen and (max-width: 1023px) {
    .contents-pa-radius {
        padding: 70px 50px !important;
    }
}

@media screen and (max-width: 639px) {
    .contents-pa-radius {
        padding: 40px 6% !important;
        border-radius: 0;
    }
    .contents-pa-radius.v-none {
        padding: 40px 6% !important;
    }
}



/*
   join us
------------------------------ */
.join-us {
    border: 1px solid #c4c4c4;
    background: #ffffff url(../img/common/joinus_bg_01.jpg) 0 center no-repeat;
    border-radius: 7px;
    height: 96px;
    display: table;
    width: 100%;
}
.join-us > * {
    display: table-cell;
    vertical-align: middle;
}
.join-us dt {
    padding: 0 30px 0 0;
    text-align: right;
    font-size: 20px;
}
.join-us dd {
    width: 200px;
}

@media screen and (max-width: 1023px) {
    .join-us {
        background: #ffffff;
    }
    .join-us dt {
        width: 66%;
        padding: 0 20px 0 0;
    }
    .join-us dd {
        width: 34%;
    }
}

@media screen and (max-width: 639px) {
    .join-us {
        display: block;
        height: inherit;
        padding: 20px 10px;
    }
    .join-us dt {
        display: block;
        width: 100%;
        text-align: center;
        padding: 0;
        font-size: 15px;
    }
    .join-us dd {
        display: block;
        width: 100%;
        text-align: center;
        margin-top: 10px;
    }
}



/*
   会社概要
====================================================================================================*/

@media screen and (max-width: 1023px) {
    .company-logo,
    .company-logo-s {
        width: 20%;
        padding-top: 0;
        padding-bottom: 0;
        padding-left: 0;
        display: table-cell;
        margin: 0 auto;

    }
}

@media (max-width: 639px) {
    #group .section-header-03 {
        margin: 50px 0 30px 0;
    }
    .company-logo,
    .company-logo-s {
        width: 40%;
        padding-bottom: 5px;
    }
    .company-logo-s {
        width: 30%;
        margin-bottom: 15px;
    }
}



/*
  Interview TOP
====================================================================================================*/

.interview-box .col {
    position:relative;
}
.interview-box .gutters {
    margin-left: -1.6%;
    margin-top: -72px;
}
.interview-box .gutters .col {
    margin-left: 1.6%;
    margin-top: 72px;
    width: 31.7%;
    min-height: 405px;
}

@media (max-width: 1023px) {
    .interview-box .gutters {
        margin-left: -2.1%;
        margin-top: -72px;
    }

    .interview-box .gutters .col {
        margin-left: 2.1%;
        margin-top: 72px;
        width: 47.85%;
    }
}

@media (max-width: 639px) {
    .interview-box .gutters {
        margin-left: 0;
        margin-top: -30px;
    }

    .interview-box .gutters .col {
        margin-left: 0;
        margin-top: 30px;
        width: 100%;
    }
}

.interview-box .thumbnail {
    position: relative;
    top: 17px;
    z-index: 9;
    height: 280px;
    border-radius: 7px;
}
.interview-box .job {
    background-color:#ffffff;
    position: absolute;
    top: 0;
    left: 17px;
    padding:9px 20px 9px 17px;
    line-height:1.5;
    font-size:14px;
    font-weight: bold;
    z-index:10;
}
.interview-box .job .number {
    font-size:13px;
    padding-right:8px;
    font-weight: normal;
}
.interview-box .job .hover-arrow {
    vertical-align: text-bottom;
}
.interview-box .title {
    background: rgba(66,145,162,0.86);
    color:#ffffff;
    position:relative;
    z-index:10;
    font-size:16px;
    line-height:1.5;
    padding:25px 0;
    width: 85%;
    margin:0 auto;
}
.interview-box .title span {
    /*display: inline-block;
    padding: 0 0 3px 0;
    border-bottom: 2px solid rgba(255,255,255,0.00);*/
}
.interview-box a:hover .title span {
    /*border-bottom: 2px solid rgba(255,255,255,0.80);*/
    text-decoration: underline;
}

@media (max-width: 1023px) {
    .interview-box img {
        width:100%;
    }
}

@media (max-width: 639px) {
    .interview-box .title {
        background:rgba(84,159,175,1.00);
        position:relative;
        z-index:10;
        font-size:16px;
        line-height:1.4;
        padding:25px 0;
        width: 100%;
        margin:0 auto;
        border-radius: 0 0 7px 7px;
    }
}



/*
  求人一覧
====================================================================================================*/
.jobs-search {
    background: #ffffff;
    border-radius: 5px;
    padding: 40px 30px;
    margin: 100px 0 0 0;
}
.jobs-search-top {
    margin: 0 0 100px 0;
}
.jobs-search h1 {
    font-size: 34px;
    background: url(../img/common/icon_search_01.png) 0 5px no-repeat;
    background-size: 24px auto;
    padding: 0 0 30px 54px;
    line-height: 1;
    border-bottom: 1px solid #c4c4c4;
    font-weight: normal;
}
.jobs-search h1 span {
    font-size: 16px;
    margin-left: 30px;
}
.jobs-search .parent > li {
    background: url(../img/common/icon_arrow_01.png) 0 15px no-repeat;
    background-size: 5px auto;
    font-size: 16px;
    padding: 0 0 0 30px;
    font-weight: bold;
    margin: 30px 0 0 0;
}
.jobs-search .parent > li .title {
    font-size: 20px;
    display: block;
}
.jobs-search .parent > li .title-sub {
    margin-top: 15px;
    display: block;
}
.jobs-search .parent > li ul {
    line-height: 1.6;
}
.jobs-search .parent > li a,
.jobs-search .parent li li {
    font-size: 16px;
    font-weight: normal;
    display: inline-block;
}
.jobs-search .parent li li {
    margin: 0 0 10px 0;
}
.jobs-search .parent li li a {
    font-size: 14px;
}
.jobs-search a.current,
.jobs-search .current a,
.jobs-search .current-cat a {
    background: #E2EEE4;
    padding: 0 10px;
    border-radius: 3px;
}
.jobs-search .parent a:hover {
    text-decoration: underline;
}
.jobs-search .parent li li:after {
    content: "|";
    margin: 0 25px;
    color: #c4c4c4;
}
.jobs-search .parent li li:last-child:after {
    content: "";
    margin: 0;
    display: none;
}

.jobs-post-none {
    text-align: center;
    font-size: 18px;
    margin-bottom: 60px;
    line-height: 1.5;
}
.jobs-post-none a {
    text-decoration: underline;
}
.jobs-post-none a:hover {
    text-decoration: none;
}

.jobs-list .text {
    background: #ffffff;
    padding: 20px 15px 15px;
    border-radius: 0 0 7px 7px;
}
.jobs-list .img {
    height: 220px;
    border-radius: 7px 7px 0 0;
}
.jobs-list .text .job {
    font-size: 19px;
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px solid #e6e6e6;
    line-height: 1.3;
}
.jobs-list .text .job .new {
    font-weight: 400;
    color: #f54444;
    font-size: 14px;
    display: inline;
    margin-left: 10px;
}
.jobs-list .text h1 {
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0 0 0;
    line-height: 1.4;
    height: 4em;
}
.jobs-list a:hover .text h1 {
    text-decoration: underline;
}
.jobs-list .text .location {
    padding: 0 0 0 15px;
    margin: 15px 0 0 0;
    background: url(../img/common/icon_marker_01.png) left center no-repeat;
    background-size: 10px auto;
}
.jobs-list .text .employment span {
    /*border: 1px solid #453939;*/
    border: 1px solid #888;
    padding: 0 3px;
    display: inline-block;
    font-size: 13px;
    margin-right: 10px;
    margin-top: 10px;
}
.jobs-list .text .location span + span:before {
    content: ",";
    display: inline-block;
    margin-right: 5px;
}

.page-numbers {
    text-align: center;
    margin: 100px 0 0 0;
}
.page-numbers li {
    display: inline-block;
    font-size: 22px;
    line-height: 1;
}
.page-numbers li span,
.page-numbers li a {
    display: inline-block;
    padding: 10px 15px;
    margin: 0 2px;
}
.page-numbers li .current,
.page-numbers li a:hover {
    background: #ffffff;
}
.page-numbers li .next,
.page-numbers li .prev {
    background: #549faf;
    padding: 8px 13px;
    color: #ffffff;
}
.page-numbers li .next:hover,
.page-numbers li .prev:hover {
    background: #ffffff;
    color: #453939;
}

.page-info {
    text-align: center;
    font-size: 18px;
    margin: 20px 0 0 0;
}

@media (max-width: 639px) {
    .jobs-search {
        padding: 20px;
        margin: 40px 0 0 0;
    }
    .jobs-search-top {
        margin: 0 0 40px 0;
    }
    .jobs-search h1 {
        font-size: 24px;
        background: url(../img/common/icon_search_01.png) 0 2px no-repeat;
        background-size: 18px auto;
        padding: 0 0 20px 30px;
    }
    .jobs-search h1 span {
        margin-left: 15px;
    }
    .jobs-search .parent > li {
        padding: 0 0 0 20px;
        margin: 20px 0 0 0;
    }
    .jobs-search .parent li li {
        margin: 0 10px 5px 0;
    }
    .jobs-search .parent li li:after,
    .jobs-search .parent li li:last-child:after {
        margin: 0 0 0 10px;
    }
    .jobs-search .parent li .title {
        margin-bottom: 10px;
        font-size: 18px;
    }
    .jobs-search .parent li .title-sub {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .jobs-list .text {
        padding: 15px;
        border-radius: 0 0 4px 4px;
    }
    .jobs-list .img {
        height: 220px;
        border-radius: 4px 4px 0 0;
    }
    .jobs-list .text .job {
        font-size: 16px;
        font-weight: bold;
    }
    .jobs-list .text .job .new {
        font-size: 12px;
        margin-left: 5px;
    }
    .jobs-list .text h1 {
        font-size: 14px;
        height: 3em;
    }
    .jobs-list .text .location {
        font-size: 12px;
    }

    .page-numbers {
        text-align: center;
        margin: 40px 0 0 0;
    }
    .page-numbers li {
        font-size: 18px;
    }
    .page-numbers li span,
    .page-numbers li a {
        padding: 8px 10px;
    }
    .page-numbers li .next,
    .page-numbers li .prev {
        padding: 6px 8px;
    }

    .page-info {
        font-size: 16px;
        margin: 10px 0 0 0;
    }
}



/*
  求人詳細
====================================================================================================*/
.jobs-header .text {
    float: left;
    width: 340px;
}
.jobs-header .img {
    float: right;
    width: 420px;
}
.jobs-header .text .job {
    font-size: 28px;
    font-weight: bold;
    padding-bottom: 5px;
    border-bottom: 1px solid #e6e6e6;
    line-height: 1.5;
}
.jobs-header .text .job .new {
    color: #f54444;
    font-size: 14px;
    display: inline;
    margin-left: 10px;
    font-weight: normal;
}
.jobs-header .text h1 {
    font-size: 24px;
    font-weight: bold;
    margin: 30px 0 0 0;
    line-height: 1.4;
}
.jobs-header .text .location {
    font-size: 18px;
    padding: 0 0 0 30px;
    margin: 10px 0 0 0;
    background: url(../img/common/icon_marker_01.png) left center no-repeat;
    background-size: 14px auto;
}
.jobs-header .text .employment span {
    /*border: 1px solid #453939;*/
    border: 1px solid #888;
    padding: 0 3px;
    display: inline-block;
    margin-right: 10px;
    margin-top: 15px;
}

.jobs-header .text .location span + span:before {
    content: ", ";
}
.jobs-header .text .brand span.cate,
.jobs-list .text .brand span {
    display: inline-block;
    border-radius: 3px;
    font-size: 16px;
    color: #ffffff;
    padding: 0 10px;
    background-color: #549faf;
    margin: 10px 0 0 0;
}
.jobs-header .text .brand a + a {
	margin-left: 10px;
}
.jobs-list .text .brand span {
    font-size: 14px;
    margin: 10px 0 0 0;
}
.jobs-list .text .brand span + span {
    margin: 10px 0 0 5px;
}
.jobs-header .text .brand a:hover .hover {
    border-bottom: 1px solid #ffffff;
}
.jobs-header .updated {
    text-align: right;
    margin: 60px 0 10px;
}

.recruit-flow {
    border: 1px solid #c8c8c8;
    padding: 40px 30px;
    background: #ffffff;
    position: relative;
}
.recruit-flow ul {
    padding: 40px 0 0 0;
    border-top: 1px solid #e6e6e6;
}
.recruit-flow li,
.contact-flow li {
    float: left;
    width: 29.735%;
}
.recruit-flow li + li,
.contact-flow li + li {
    width: 35.1325%;
    padding-left: 6.35%;
    background: url(../img/common/icon_arrow_01.png) 27px 14px no-repeat;
    background-size: 10px auto;
}
.recruit-flow .step,
.contact-flow .step {
    text-align: center;
    font-size: 18px;
    border-radius: 4px;
    line-height: 1;
    padding: 15px 0;
    margin: 0 0 30px 0;
}
.recruit-flow .step {
    background: #dff0f4;
}
.contact-flow .step {
    background: #f5f5f4;
}
.recruit-flow .heading-02 h2 {
    font-size: 22px;
}
.recruit-flow .step.current,
.contact-flow .step.current {
    background: #549faf;
    color: #ffffff;
}

.error-text {
    background: #f54444;
    color: #ffffff;
    line-height: 1.3;
    padding: 10px 0;
    text-align: center;
    border-radius: 4px;
}

@media (max-width: 1023px) {
    .jobs-header .text {
        float: none;
        width: 100%;
        margin-top: 20px;
    }
    .jobs-header .img {
        float: none;
        margin-left: auto;
        margin-right: auto;
    }

    .recruit-flow li + li,
    .contact-flow li + li {
        background: url(../img/common/icon_arrow_01.png) 17px 14px no-repeat;
        background-size: 10px auto;
    }
}

@media (max-width: 639px) {
    .jobs-header .img {
        width: 100%;
    }
    .jobs-header .text .job {
        font-size: 16px;
    }
    .jobs-header .text h1 {
        font-size: 16px;
        margin: 20px 0 0 0;
    }
    .jobs-header .text .location {
        font-size: 16px;
        padding: 0 0 0 20px;
        margin: 10px 0 0 0;
        background-size: 10px auto;
    }

    .recruit-flow {
        padding: 20px 20px;
    }
    .recruit-flow ul {
        padding: 20px 0 0 0;
    }
    .recruit-flow li {
        float: none;
        width: 100%;
    }
    .recruit-flow li + li {
        width: 100%;
        padding-left: 0;
        background: none;
        margin: 30px 0 0 0;
    }
    .recruit-flow .step {
        padding: 10px 0;
        margin: 0 0 20px 0;
    }

    .contact-flow .step {
        font-size: 14px;
        line-height: 1.2;
        padding: 10px 0;
        margin: 0 0 10px 0;
    }
    .contact-flow li + li {
        background: url(../img/common/icon_arrow_01.png) 8px 20px no-repeat;
        background-size: 7px auto;
    }
}



/*
  ブログ（News）
====================================================================================================*/
.blog-con header .info {
    border-top: 1px solid #e6e6e6;
    padding: 15px 0 0 0;
    margin: 0 0 40px 0;
}
.single-activity .blog-con header .info,
.single-fram-news .blog-con header .info {
    border-top: none;
    margin: 0 0 40px 0;
    padding: 0;
}
.blog-con header .info li {
    float: left;
    width: 50%;
    font-size: 16px;
}
.blog-con header .info li:nth-of-type(2) {
    text-align: right;
}
.blog-con header .info li:nth-of-type(1) .cate {
    padding: 0;
}
.blog-con header .info li:nth-of-type(1) .cate a,
.blog-con header .info li:nth-of-type(2) .cate a {
    display: inline-block;
    border-radius: 4px;
    font-size: 12px;
    color: #ffffff;
    padding: 0 10px;
    background-color: #549faf;
}
.blog-con header .info li:nth-of-type(1) .cate a:hover,
.blog-con header .info li:nth-of-type(2) .cate a:hover {
    text-decoration: underline;
}
.blog-con header .info li .cate a + a {
    margin-left: 5px;
}
.blog-box {
    background: #ffffff;
    border-radius: 7px;
    padding: 50px;
}
.single-fram-news .blog-box h1 {
    color: #549faf;
}
.blog-box h1 span {
    float: right;
    font-size: 16px;
    color: #453939;
    font-weight: 400;
}
.blog-content {
    padding: 0 0 0 0;
}
.blog-content h1 {
    font-size: 24px;
    margin-bottom: 25px;
    line-height: 1.5;
}
.blog-content h2 {
    font-size: 20px;
    margin: 40px 0 20px;
    line-height: 1.5;
}
.blog-content h3 {
    font-size: 18px;
    margin: 40px 0 10px;
    line-height: 1.5;
}
.blog-content h4 {
    font-size: 16px;
    margin: 30px 0 10px;
    line-height: 1.5;
}
.blog-content h1 + *,
.blog-content h2 + *,
.blog-content h3 + *,
.blog-content h4 + * {
    margin-top: 0 !important;
}
.blog-content ol {
    list-style: decimal;
    margin: 20px 0 0 15px;
}
.blog-content ol li + li {
    margin: 10px 0 0 0;
}
.blog-content ul {
    margin: 20px 0 0 0;
}
.blog-content ul li {
    background: url(../img/common/dot_01.png) 5px 10px no-repeat;
    background-size: 6px auto;
    padding: 0 0 0 20px;
}
.blog-content ul li + li {
    margin: 10px 0 0 0;
}
.blog-content img {
    margin: 30px auto;
    display: block;
    border-radius: 7px;
}
.blog-content p:first-child img:first-child {
    margin-top: 0;
}
.blog-content img + br {
    display: none;
}
.blog-content a {
    color: #549faf;
}
.blog-content a:hover {
    text-decoration: underline;
}
.blog-content .wp-caption {
    max-width: 100% !important;
    font-size: 12px;
    margin-left: auto;
    margin-right: auto;
}
.blog-content .wp-caption {
	margin-bottom: 30px;
}
.blog-content .wp-caption img {
    margin: 30px auto 10px;
}
.blog-content .wp-caption-text {
    text-align: center;
    font-weight: bold;
    font-size: 16px;
}

.blog-keyword {
    background: #f8f8f8 url(../img/common/icon_keyword_01.png) 20px 14px no-repeat;
    background-size: 19px auto;
    padding: 10px 20px 10px 50px;
    margin: 80px 0 0 0;
}
.blog-keyword a:hover {
    text-decoration: underline;
}
.single-activity .blog-keyword a + a:before,
.single-fram-news .blog-keyword a + a:before {
    content: ", ";
}

.sns-btn-list {
    margin: 10px 0 0 0;
    line-height: 1;
    position: relative;
}
.sns-btn-list > * {
    vertical-align: bottom !important;
    margin: 10px 10px 0 0;
}
.fb-share-button,
.twitter-share-button,
.g-plus,
.hatena-bookmark-button,
.pocket-btn {
    display: inline-block;
}
.sns-btn-list .hatena-bookmark-button-frame {
    margin-right: 0 !important;
}
.sns-btn-list .pocket-btn {
    margin: 0 !important;
}

.post-nav {
    text-align: center;
    margin: 80px 0 0 0;
}
.post-nav li {
    display: inline-block;
    margin: 0 20px;
}
.post-nav li a {
    border-radius: 2px;
}
.cate-none.info {
    display: none;
}

.post-nav-02 {
    background: #ffffff;
    padding: 30px;
    border-radius: 7px;
    margin: 30px 0 0 0;
}
.post-nav-02 .next {
    float: left;
    width: 50%;
}
.post-nav-02 .prev {
    float: right;
    width: 50%;
    text-align: right;
}
.post-nav-02 li a {
    display: table;
    width: 100%;
}
.post-nav-02 li a > span {
    display: table-cell;
    vertical-align: top;
}
.post-nav-02 li a > span > span {
    display: block;
}
.post-nav-02 li a > span.pic {
    width: 80px;
}
.post-nav-02 li.next a > span.text {
    padding-left: 20px;
}
.post-nav-02 li.prev a > span.text {
    padding-right: 20px;
}
.post-nav-02 li a > span.text .nav {
    font-size: 20px;
}
.post-nav-02 li a > span.text .title {
    line-height: 1.5;
}
.post-nav-02 li a > span.pic span {
    width: 70px;
    height: 70px;
}
.post-nav-02 li a > span.pic .thumbnail {
    background: url(../img/common/noimage.png) center center no-repeat;
    background-size: cover;
}
.post-nav-02 li.prev a > span.pic {
    padding: 0 0 0 10px;
}

.blog-search {
    padding: 50px 60px;
    border-radius: 5px;
    position: relative;
}
.blog-search dt {
    font-size: 16px;
    color: #549faf;
    margin: 0 0 20px 0;
}
.blog-search dt span {
    font-size: 28px;
    color: #453939;
    margin-right: 10px;
}
.blog-search li {
    font-size: 16px;
    display: inline;
}
.blog-search li a:hover {
    text-decoration: underline;
}
.blog-search li + li:before {
    content: "|";
    margin: 0 25px;
    color: #c4c4c4;
}
.post-type-archive-activity .blog-search .keyword li + li:before,
.single-activity .blog-search .keyword li + li:before,
.post-type-archive-fram-news .blog-search .keyword li + li:before,
.single-fram-news .blog-search .keyword li + li:before {
    content: "";
    margin: 0;
}
.blog-search dl + dl {
    border-top: 1px solid #e6e6e6;
    margin: 40px 0 0 0;
    padding: 20px 0 0 0;
}
.blog-search .archives dd li {
}
.blog-search .keyword dd a {
    display: inline-block;
    border-radius: 3px;
    border: 1px solid #acafac;
    padding: 5px 20px;
    line-height: 1;
    font-weight: normal;
    font-size: 14px !important;
    margin: 0 10px 10px 0;
}
.blog-search .keyword dd a:hover {
    background: #549faf;
    color: #ffffff;
    text-decoration: none;
}

@media screen and (max-width: 1023px) {
    .blog-search {
        padding: 20px;
    }
    .blog-search dt {
        font-size: 14px;
        margin: 0 0 10px 0;
    }
    .blog-search dt span {
        font-size: 24px;
    }
    .blog-search li + li:before {
        content: "";
        margin: 0;
    }
    .blog-search li {
        margin-right: 15px;
    }
    .blog-search .keyword li {
        margin-right: 0;
    }
    .blog-search dl + dl {
        margin: 20px 0 0 0;
        padding: 10px 0 0 0;
    }
}

@media screen and (max-width: 639px) {
    .blog-con header .info {
        margin: 15px 0 20px 0;
    }

    .blog-content h1 {
        font-size: 20px;
        margin-bottom: 20px;
    }
    .blog-content h2 {
        font-size: 18px;
        margin: 30px 0 15px;
    }
    .blog-content h3 {
        font-size: 16px;
        margin: 30px 0 10px;
    }
    .blog-content h4 {
        font-size: 16px;
        margin: 20px 0 10px;
    }

    .blog-search dt {
        font-size: 12px;
        margin: 0 0 5px 0;
    }
    .blog-search dt span {
        font-size: 18px;
    }
    .blog-search li {
        font-size: 14px;
    }

    .blog-box {
        padding: 20px;
    }
    .blog-keyword {
        margin: 40px 0 0 0;
    }

    .post-nav {
        margin: 40px 0 0 0;
    }
    .post-nav li {
        margin: 0 10px;
        line-height: 1.3;
    }

    .post-nav-02 {
        padding: 20px;
    }
    .post-nav-02 .next {
        width: 100%;
    }
    .post-nav-02 .prev {
        width: 100%;
        border-top: 1px solid #cccccc;
        padding: 10px 0 0 0;
        margin: 10px 0 0 0;
    }
}







/*
   わたしたちの想い
====================================================================================================*/
.lead-01 {
    font-size: 34px;
    font-weight: bold;
    line-height: 1.3;
    margin-bottom: 80px;
    text-align: center;
}
.lead-01 span {
    display:block;
    font-size: 28px;
    font-weight: normal;
    line-height: 1.3;
    padding-top: 30px;
}
.lead-02 {
    font-size: 28px;
    font-weight: bold;
    line-height: 1.3;
    margin-bottom: 60px;
    text-align: center;
}

@media screen and (max-width: 1023px) {
    .lead-01 {
        font-size: 28px;
        margin-bottom: 60px;
    }
    .lead-01 span {
        font-size: 22px;
        padding-top: 20px;
    }
    .lead-02 {
        font-size: 22px;
        margin-bottom: 40px;
    }
}

@media screen and (max-width: 639px) {
    .lead-01 {
        font-size: 26px;
        margin-bottom: 40px;
    }
    .lead-01 span {
        font-size: 20px;
        padding-top: 10px;
    }
    .lead-02 {
        font-size: 16px;
        margin-bottom: 20px;
    }
}



/*
   採用メッセージ
====================================================================================================*/

.recruit-message-img {
    margin: 60px auto 0;
    width: 85.2%;
}
.recruit-message-img li {
    float: left;
    width: 29.7%;
}
.recruit-message-img li + li {
    margin-left: 5.4%;
}
@media screen and (max-width: 639px) {
    .recruit-message-img {
        margin: 20px auto 0;
        width: 98%;
    }

}



/*
   活動レポート
====================================================================================================*/
.activity-list li {
    background: #ffffff;
    border-radius: 7px;
    padding: 50px 40px;
}
.activity-list li + li {
    margin: 40px 0 0 0;
}
.activity-list li h2 {
    font-size: 24px;
    margin: 0 0 20px 0;
    line-height: 1.3;
}
.activity-list li h2 a:hover {
    text-decoration: underline;
}
.post-type-archive-fram-news .activity-list li h2 a {
    color: #549faf;
}
.activity-list li h2 span {
    float: right;
    font-size: 14px;
    font-weight: 400;
}
.activity-list li .wrap > div.img {
    float: right;
    width: 42.37%;
    padding: 0 0 0 50px;
}
.activity-list li .wrap > div.img .date {
    text-align: right;
    margin: 0 0 30px 0;
}
.activity-list li .wrap > div.img .pic {
    position: relative;
}
.activity-list li .wrap > div.img .pic dt {
    height: 230px;
    display: block;
    border-radius: 7px;
}
.activity-list li .wrap > div.img .pic dt a {
    height: 230px;
    display: block;
    border-radius: 7px;
}
.activity-list li .wrap > div.img .pic dd {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #ffffff;
    background: #549faf;
    padding: 0 10px;
    font-size: 12px;
    border-radius: 3px;
}
.activity-list li .wrap > div.text {
    float: left;
    width: 57.63%;
}
.activity-list li .wrap > div.text .body {
    height: 180px;
    overflow: hidden;
    position: relative;
}
.activity-list li .wrap > div.text .body:after {
    content: "";
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(to bottom, rgba(255,255,255,0.00), rgba(255,255,255,0.00) 40%, rgba(255,255,255,0.80) 80%, rgba(255,255,255,1.00) );
    height: 180px;
    width: 100%;
}
.activity-list li .wrap > div.text .more a {
    display: block;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    border: 1px solid #e6e6e6;
    padding: 5px 0;
}
.activity-list li .wrap > div.text .more a:hover {
    background: #e8f4f7;
}
.post-type-archive-fram-news .activity-list li .wrap > div.text .more a {
    color: #549faf;
    border: 1px solid #afd9e3;
}

@media screen and (max-width: 639px) {
    .activity-list li {
        padding: 20px;
        display: block;
    }
    .activity-list li + li {
        margin: 20px 0 0 0;
    }
    .activity-list li h2 {
        font-size: 18px;
        margin: 0 0 10px 0;
    }
    .activity-list li .wrap > div {
        float: none;
        width: 100% !important;
        padding: 0 !important;
    }
    .activity-list li .wrap > div.text {
        margin: 20px 0 0 0;
    }
    .activity-list li .wrap > div.text .body {
        height: 100px;
    }
    .activity-list li .wrap > div.text .body:after {
        height: 100px;
    }
}




/* thumbnail高さ調整 */
@media screen and (max-width: 1023px) {

}
@media screen and (max-width: 639px) {

}
@media screen and (max-width: 479px) {
    main .g-wrap-l .gutters,
    main .g-wrap-l-odd .gutters {
        margin-top: -30px;
    }
    main .g-wrap-l .gutters .col,
    main .g-wrap-l .gutters .col .gutters .col,
    main .g-wrap-l-odd .gutters .col,
    main .g-wrap-l-odd .gutters .col .gutters .col {
        margin-top: 30px;
    }
}

/* thumbnail高さ調整 */

main .link-btn-02 dl .thumbnail {
    height: 100%;
}

@media screen and (max-width: 1023px) {

}
@media screen and (max-width: 639px) {
    main .thumbnail,
    body.page-template-page-philosophy main .philosophy-thumbnail-list dl dt,
    main .philosophy-thumbnail-list dl dt,
    main .activity-list li .wrap > div.img .pic dt,
    main .thumbnail-list-01 .img,
    main .jobs-list .img {
		height: 200px;
	}

    main .company-con .img {
        height: 350px;
    }
}
@media screen and (max-width: 479px) {
    main .thumbnail,
    body.page-template-page-philosophy main .philosophy-thumbnail-list dl dt,
    main .philosophy-thumbnail-list dl dt,
    main .activity-list li .wrap > div.img .pic dt,
    main .thumbnail-list-01 .img,
    main .jobs-list .img {
		height: 180px;
	}

    main .company-con .img {
        height: 200px;
    }
}


/* 画像サイズ調整 */
@media screen and (max-width: 1023px) {

}
@media screen and (max-width: 639px) {
/*
    main .g-wrap-s > p > img,
    main .g-wrap-s > div > img,
    main .g-wrap-s > img,
    main .g-wrap-s-odd > p > img,
    main .g-wrap-s-odd > div > img,
    main .g-wrap-s-odd > img,

    main .g-wrap-m > p > img,
    main .g-wrap-m > div > img,
    main .g-wrap-m > img,
    main .g-wrap-m-odd > p > img,
    main .g-wrap-m-odd > div > img,
    main .g-wrap-m-odd > img,

    main .g-wrap-l > p > img,
    main .g-wrap-l > div > img,
    main .g-wrap-l > img,
    main .g-wrap-l-odd > p > img,
    main .g-wrap-l-odd > div > img,
    main .g-wrap-l-odd > img,

    body .footer-info .brand li img {
        margin-left: auto;
        margin-right: auto;
        display: block;
        max-width: 80%;
    }
*/
    main .sp-width-l {
        margin-left: auto;
        margin-right: auto;
        display: block;
        width: 80%;
    }

    main .gutters img {
        margin-left: auto;
        margin-right: auto;
        display: block;
        max-width: 60%;
    }

    main .gutters img.full-width {
        max-width: 100%;
    }


    main .g-wrap-s > p > img.full-width,
    main .g-wrap-s > div > img.full-width,
    main .g-wrap-s > img.full-width,
    main .g-wrap-s-odd > p > img.full-width,
    main .g-wrap-s-odd > div > img.full-width,
    main .g-wrap-s-odd > img.full-width,

    main .g-wrap-m > p > img.full-width,
    main .g-wrap-m > div > img.full-width,
    main .g-wrap-m > img.full-width,
    main .g-wrap-m-odd > p > img.full-width,
    main .g-wrap-m-odd > div > img.full-width,
    main .g-wrap-m-odd > img.full-width,

    main .g-wrap-l > p > img.full-width,
    main .g-wrap-l > div > img.full-width,
    main .g-wrap-l > img.full-width,
    main .g-wrap-l-odd > p > img.full-width,
    main .g-wrap-l-odd > div > img.full-width,
    main .g-wrap-l-odd > img.full-width,

    body .footer-info .brand li img {
        width: 100%;
    }
}
@media screen and (max-width: 479px) {

}


/* 文字中央配置 */
@media screen and (max-width: 1023px) {

}
@media screen and (max-width: 639px) {
    main .heading-02 + .t-center,
    main .interview-box .title,
    body.page-template-page-brands .heading-02,
    body.page-template-page-brands .heading-03 {
        text-align: center !important;
    }
}
@media screen and (max-width: 479px) {
}


/* 画像サイズ調整 */
@media screen and (max-width: 1023px) {

}
@media screen and (max-width: 639px) {

}
@media screen and (max-width: 479px) {
    main .main-header2 h1 {
        font-size: 32px;
    }
    main .main-header2 p.base,
    main .link-btn-03 dd .more {
        font-size: 14px;
    }

    main .section-header-03 h1 {
        font-size: 22px;
    }
    main .lead-01 {
        font-size: 24px;
    }

    main .profile-04 .profile-inner h1 {
        font-size: 20px;
    }

    main .g-wrap-l > ul > li {
        font-size: 12px;
    }
}



/*
   上下左右のパディング
------------------------------ */
.contents-pa-radius-02 {
    padding: 40px 50px !important;
    border-radius: 7px;
}

@media screen and (max-width: 1023px) {
    .contents-pa-radius-02 {
        padding: 30px 40px !important;
    }
}

@media screen and (max-width: 639px) {
    .contents-pa-radius-02 {
        padding: 20px 6% !important;
        border-radius: 0;
    }
}

.contents-pa-radius-03 {
    padding: 30px 35px !important;
    border-radius: 7px;
}

@media screen and (max-width: 1023px) {
    .contents-pa-radius-03 {
        padding: 20px 20px !important;
    }
}

@media screen and (max-width: 639px) {
    .contents-pa-radius-03 {
        padding: 20px 6% !important;
        border-radius: 0;
    }
}

.contents-pa-radius-04 {
    padding: 10px !important;
    border-radius: 7px;
}

@media screen and (max-width: 639px) {
    .contents-pa-radius-04 {
        padding: 10px 6% !important;
        border-radius: 0;
    }
}

.contents-pa {
    padding: 40px !important;
}

@media screen and (max-width: 639px) {
    .contents-pa {
        padding: 30px 20px !important;
    }
}



/*
   環境負荷の軽減
====================================================================================================*/
.reduce-con {
    position: relative;
    margin: 100px 0 0 0;
}
.reduce-con .img {
    position: relative;
}
.reduce-con .text {
    position: relative;
    padding: 50px 30px;
    background: #ffffff;
    border-radius: 7px;
}
.reduce-con .text p.note {
    font-size: 10px;
    margin-top: 18px;
    line-height: 1.6;
    letter-spacing: 1px;
    text-align: right;
}
.reduce-con .text h1 {
    font-size: 24px;
    line-height: 1;
    margin: 0 0 40px 0;
    font-weight: bold;
}
.reduce-con .text h2 {
    font-size: 18px;
    line-height: 1.2;
    margin: 0 0 20px 0;
}
.reduce-con .text p + h2 {
    margin: 50px 0 20px 0;
}
.reduce-con.con01 .img,
.reduce-con.con02 .img,
.reduce-con.con04 .img,
.reduce-con.con05 .img {
    text-align: right;
    margin: 0;
}
.reduce-con.con03 .img {
    margin: 0 0 0 30px;
}
.reduce-con.con01 .img img,
.reduce-con.con03 .img img,
.reduce-con.con05 .img img {
    width: 457px;
}
.reduce-con.con01 .text {
    width: 600px;
    margin: -400px 0 0 50px;
}
.reduce-con.con02 .text,
.reduce-con.con04 .text {
    width: 710px;
    margin: -105px auto 0;
}
.reduce-con.con03 .text {
    width: 595px;
    margin: -400px 0 0 345px;
}
.reduce-con.con05 .text {
    width: 600px;
    margin: -120px 0 0 50px;
}


@media screen and (max-width: 1023px) {
    .reduce-con {
        margin: 70px 0 0 0;
    }
    .reduce-con .text {
        padding: 50px 30px;
    }
    .reduce-con .text h1 {
        margin: 0 0 30px 0;
    }
    .reduce-con .text p + h2 {
        margin: 40px 0 20px 0;
    }
    .reduce-con.con03 .img {
        margin: 0 0 0 0;
    }

    .reduce-con.con01 .text,
    .reduce-con.con05 .text {
        width: 560px;
        margin: -100px 0 0 0;
    }
    .reduce-con.con02 .text,
    .reduce-con.con04 .text {
        width: 80%;
        margin: -80px auto 0;
    }
    .reduce-con.con03 .text {
        width: 595px;
        margin: -100px 0 0 0;
        float:right;
    }

}

@media screen and (max-width: 639px) {
    .reduce-con {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .reduce-con.con01 .text,
    .reduce-con.con02 .text,
    .reduce-con.con03 .text,
    .reduce-con.con04 .text,
    .reduce-con.con05 .text {
        width: 100%;
        margin: 0;
        float: none;
        padding: 20px 0 0;
    }
    .reduce-con .text h1 {
        font-size: 24px;
        margin: 0 0 20px 0;
    }
    .reduce-con .text h2 {
        font-size: 16px;
        margin: 0 0 10px 0;
    }
    .reduce-con .text p + h2 {
        margin: 20px 0 10px 0;
    }
    .reduce-con .img img {
        width: 100%;
    }
}



/*
   ネイチャーズウェイの歴史
====================================================================================================*/
.history-con {
    position: relative;
}
.history-con + .history-con {
    margin: 120px 0 0 0;
}
.history-con .img {
    position: relative;
}
.history-con .text {
    position: relative;
    padding: 50px 30px;
    background: #ffffff;
    border-radius: 5px;
}
.history-con .text h1 {
    font-size: 36px;
    line-height: 1;
    margin: 0 0 10px 0;
    font-weight: 400;
    font-style: italic;
}
.history-con .text h2 {
    font-size: 24px;
    line-height: 1.2;
    margin: 0 0 20px 0;
}
.history-con .text h3 {
    margin:40px 0 20px 0;
    font-size: 24px;
    font-weight: 400;
    font-style: italic;
}

.history-con.con01 .img,
.history-con.con02 .img,
.history-con.con04 .img {
    text-align: right;
    margin: 0;
}
.history-con.con01 .img2,
.history-con.con04 .img2 {
    text-align: right;
    position:relative;
    z-index:11;
}
.history-con.con01 .img2 {
    margin: -240px 30px 0 0;
}
.history-con.con04 .img2 {
    position: absolute;
    top: 1730px;
    right: 0;
}
.history-con.con03 .img {
    margin: 0 0 0 30px;
}

.history-con.con02 .img img {
    width: 460px;
}
.history-con.con03 .img img {
    width: 457px;
}
.history-con.con01 .img2 img,
.history-con.con04 .img2 img {
    width: 291px;
}

.history-con.con01 .text,
.history-con.con04 .text {
    width: 710px;
    margin: -105px auto 0;
    position:relative;
    z-index:10;
}
.history-con.con02 .text {
    width: 610px;
    margin: -400px 0 0 40px;
}
.history-con.con03 .text {
    width: 595px;
    margin: -370px 0 0 330px;
}

.history-logo-text,
.history-logo,
.history-logo-text2,
.history-logo2,
.history-logo-square {
    float:left;
}

.history-con.con02 .history-logo-text{
    width: 410px;
}
.history-con.con02 .history-logo{
    width: 100px;
    margin: 60px 0 0 30px;
}
.history-con.con02 .history-logo-square{
    width: 120px;
    margin: 80px 0 0 20px;
}
.history-con.con03 .history-logo-text {
    width: 300px;
}
.history-con.con03 .history-logo {
    width: 96px;
    margin: 60px 0 0 30px;
}
.history-con.con03 .history-logo-square {
    width: 120px;
    margin: 80px 0 0 30px;
}
.history-con.con03 .history-logo-text2 {
    width: 300px;
}
.history-con.con03 .history-logo2 {
    width: 195px;
    margin: 95px 0 0 15px;
}

.history-con.con04 .history-logo-text{
    width: 410px;
}
.history-con.con04 .history-logo{
    width: 194px;
    margin: 90px 0 0 30px;
}
.history-con.con04 .history-logo-text2 {
    width: 460px;
}
.history-con.con04 .history-logo2 {
    width: 105px;
    margin: 80px 0 0 30px;
}
.history-logo3 {
    width: 195px;
    margin: 10px 0 0 0;
}

@media screen and (max-width: 1024px) {
    .history-con.con04 .img2 {
        top: 1710px;
    }
}

@media screen and (max-width: 1023px) {
    .history-con + .history-con {
        margin: 80px 0 0 0;
    }
    .history-logo-text,
    .history-logo,
    .history-logo-text2,
    .history-logo2,
    .history-logo-square {
        float:none;
    }
    .history-con .text h3 {
        margin:40px 0 20px 0;
    }

    .history-con.con01 .img,
    .history-con.con02 .img,
    .history-con.con04 .img {
        text-align: right;
        margin: 0;
    }
	.history-con.con01 .img2,
	.history-con.con04 .img2 {
        text-align: right;
        position: relative;
        z-index: 11;
    }
    .history-con.con01 .img2 {
        margin: -150px 0 0 0;
    }
	.history-con.con04 .img2 {
        display: none;
    }
    .history-con.con01 .img2 img,
	.history-con.con04 .img2 img {
        width: 200px;
    }
	.history-con.con03 .img {
        margin: 0;
    }

	.history-con.con01 .text {
        width: 80%;
        margin: -80px auto 0;
    }
    .history-con.con02 .text {
        width: 560px;
        margin: -150px 0 0 30px;
    }
    .history-con.con03 .text {
        width: 70%;
        margin: -170px 0 0 0;
        float:right;
    }
    .history-con.con04 .text {
        width: 80%;
        margin: -80px auto 0;
        position:relative;
        z-index:10;
    }

    .history-con.con02 .history-logo-text,
    .history-con.con03 .history-logo-text,
    .history-con.con03 .history-logo-text2,
    .history-con.con04 .history-logo-text,
    .history-con.con04 .history-logo-text2 {
        width: 100%;
    }
    .history-con.con02 .history-logo,
    .history-con.con02 .history-logo-square,
    .history-con.con03 .history-logo,
    .history-con.con03 .history-logo-square,
    .history-con.con03 .history-logo2,
    .history-con.con04 .history-logo,
    .history-con.con04 .history-logo2 {
       margin: 20px auto 0;
    }
    .history-con.con02 .history-logo{
        width: 100px;
    }
    .history-con.con03 .history-logo {
        width: 96px;
    }
    .history-con.con03 .history-logo2 {
        width: 195px;
    }
    .history-con.con04 .history-logo {
        width: 194px;
    }
    .history-con.con04 .history-logo2 {
        width: 105px;
    }
	.history-con.con01 p:last-child,
    .history-con.con04 p:last-child {
        width: 72%;
    }
}

@media screen and (max-width: 639px) {
    .history-con + .history-con {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .history-con .text {
        position: relative;
        margin: 0;
        padding: 20px 0 0;
    }
    .history-con .text h1 {
        font-size: 22px;
        margin: 0;
    }
    .history-con .text h2 {
        font-size: 18px;
        margin: 10px 0 0 0;
    }
    .history-con .text p {
        margin: 10px 0 0 0;
    }
    .history-con .text h3 {
        margin:20px 0 10px 0;
        font-size: 20px;
        line-height:1.2;
    }

    .history-con.con01 .img,
    .history-con.con02 .img,
    .history-con.con03 .img,
    .history-con.con04 .img {
        text-align: left;
        margin: 0;
    }
    .history-con.con01 .img2,
    .history-con.con04 .img2 {
        width: 60%;
        margin: 10px auto 0;
        text-align: center;
    }
    .history-con .img img,
    .history-con.con04 .img2,.history-con.con04 .img2 img {
        width: 100% !important;
    }

    .history-con.con01 .text,
    .history-con.con02 .text,
    .history-con.con03 .text,
    .history-con.con04 .text {
        width: 100%;
        margin: 0;
    }
    .history-con.con02 .history-logo,
    .history-con.con03 .history-logo,
    .history-con.con03 .history-logo2,
    .history-con.con04 .history-logo,
    .history-con.con04 .history-logo2 {
       margin: 30px auto 0;
    }

    .history-con.con01 p:last-child,
    .history-con.con04 p:last-child {
        width: 100%;
    }
}



/*
   ブランド
====================================================================================================*/
.all-brands {
    font-size: 0;
    margin: -30px 0 0 0;
    text-align: center;
}
.all-brands li {
    display: inline-block;
    padding: 0 10px;
    text-align: center;
    margin: 30px 0 0 0;
    width: 200px;
}
.all-brands.v-s {
    margin: -10px 0 0 0;
}
.all-brands.v-s li {
    margin: 10px 0 0 0;
}
.brand-con .links li a {
    text-decoration: underline;
}
.brand-con .links li a:hover {
    text-decoration: none !important;
}
.all-brands li img {
    vertical-align: middle;
}
.brand-con .brand-logo {
    width: 300px;
}
.brand-con .brand-logo.mark {
    width: 150px;
}
.brand-con.con01 .brand-logo {
    margin-left: -20px;
}
.brand-con.con02 .brand-logo {
    margin-left: -25px;
}
.brand-con.con03 .brand-logo {
    margin-left: -15px;
}
.brand-con.con04 .brand-logo {
    margin-left: -40px;
}
.brand-con.con05 .brand-logo {
    margin-left: -20px;
}
.brand-con.con06 .brand-logo {
    margin-left: -55px;
}
.brand-con.con07 .brand-logo {
    margin-left: -20px;
}
.brand-con.con08 .brand-logo {
    margin-left: -6px;
}
.brand-con.con09 .brand-logo {
    margin-left: -5px;
}
.brand-con.con10 .brand-logo {
    margin-left: -75px;
}

@media screen and (max-width: 1023px) {
    .all-brands {
        margin: -30px 0 0 0;
    }
    .all-brands li {
        margin: 30px 0 0 0;
    }

}

@media screen and (max-width: 639px) {
    .all-brands {
        margin: -20px 0 0 0;
    }
    .all-brands li {
        width: 50%;
        margin: 20px 0 0 0;
    }
    main .brand-con .brand-logo {
        width: 80%;
    }
    main .brand-con .brand-logo.mark {
        width: 40%;
    }
    main.main-area .brand-con .brand-logo {
        margin-left: auto;
        margin-right: auto;
    }
    main .brand-con .brand-logo img {
        margin: 0 auto;
    }
}

/*
   brand contents
------------------------------ */
.brand-con {
    position: relative;
    margin: 100px 0 0 0;
}
.brand-con + .brand-con {
    margin: 60px 0 0 0;
}
.brand-con .brand-logo {
    margin-bottom: 20px;
}
.brand-con .img {
    position: relative;
}
.brand-con .img img {
    width: 470px;
}
.brand-con .text {
    width: 595px;
    position: relative;
    padding: 20px 30px;
    background: #ffffff;
    border-radius: 5px;
    margin: -175px 0 0 389px;
}
.brand-con .links {
    margin: 30px 0 0 -23px;
}
.brand-con .links li {
    display: inline-block;
    margin: 0 0 0 23px;
    font-size: 13px;
}
.brand-con .links-block li {
    display: block;
}
.brand-con .links li a {
    background-repeat: no-repeat;
    background-position:0 0;
    padding-bottom: 3px;
}
.brand-con .links li a:hover {
   text-decoration: underline;
}
.brand-con .links li:nth-child(1) a {
    background-image: url(../img/common/icon_site.png);
    background-size: 14px 14px;
    padding-left: 17px;
}
.brand-con .links li:nth-child(2) a {
    background-image: url(../img/common/icon_bell.png);
    background-size: 14px 14px;
    padding-left: 18px;
}
.brand-con .links li:nth-child(3) a,
.brand-con .links li a.cart {
    background-image: url(../img/common/icon_cart.png);
    background-size: 19px 14px;
    padding-left: 23px;
}

@media screen and (max-width: 1023px) {
    .brand-con {
        margin: 70px 0 0 0;
    }
    .brand-con + .brand-con {
        margin: 50px 0 0 0;
    }
    .brand-con .img img {
        width: 60%;
    }
    .brand-con .text {
        width: 70%;
        margin: -80px auto 0;
        float: right;
    }
    .brand-con .links {
        margin: 30px 0 0 0;
    }
    .brand-con .links li {
        display: block;
        margin: 0;
        font-size: 14px;
    }
}
@media screen and (max-width: 639px) {
    .brand-con {
        margin: 40px 0 0 0;
    }
    .brand-con + .brand-con {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .brand-con .img img {
        width: 100%;
    }
    .brand-con .text {
        width: 100%;
        margin: 0;
        float: none;
        padding: 20px 0 0;
    }
    .brand-con .text .brand-logo {
        text-align: center;
    }
    .brand-con .links {
        margin: 20px 0 0 0;
    }
    .brand-con .links li + li {
        padding: 10px 0 0 0;
    }
}



/*
   環境保護の取り組み
====================================================================================================*/

/*
   グリーンの囲み・イラスト付き
------------------------------ */
.content-illust {
    background-image: url(../img/sustainability/sustainability_img_01.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 90%;
    font-size: 22px;
    line-height:1;
    padding: 80px 0;
    border-radius: 7px;
    text-align: center !important;
}
.content-illust .donation {
    font-size: 56px;
}
.content-illust .donation span {
    font-size: 26px;
    margin-left:10px;
}
.content-illust .years {
    font-size: 14px;
    font-weight: normal;
}

@media screen and (max-width: 639px) {
    .content-illust {
        font-size: 16px;
        padding: 40px 0;
    }
    .content-illust .donation {
        font-size: 32px;
    }
    .content-illust .donation span {
        font-size: 16px;
    }
    .content-illust .years {
        font-size: 12px;
    }
}



/*
   自然素材へのこだわり
====================================================================================================*/

.traceability-box .gutters {
    margin-left: -1.88%;
    margin-top: -18px;
}
.traceability-box .gutters .col {
    position: relative;
    margin-left: 1.88%;
    margin-top: 18px;
    width: 23.12%;
    height: 223px;
    border: 1px solid #afd9e3;
    border-radius: 7px;
    background-color: #ffffff;
}
.traceability-box .gutters .col:nth-child(5) {
    margin-left: 14.58%;
}
.traceability-box .gutters .col dl dt {
    color: #549faf;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    padding: 50px 0 0 0;
}
.traceability-box .gutters .col dl dd {
    text-align: center;
    font-size: 15px;
    line-height: 1.5;
    margin-top: 30px;
}

@media screen and (max-width: 1023px) {
    .traceability-box .gutters {
        margin-left: 0;
        margin-top: -18px;
    }
    .traceability-box .gutters .col {
        margin-left: 0;
        margin-top: 18px;
        width: 100%;
        height: auto;
        padding: 20px;
    }
    .traceability-box .gutters .col:nth-child(5) {
        margin-left: 0;
    }
    .traceability-box .gutters .col dl dt {
        font-size: 24px;
        text-align: left;
        padding: 0 0 0 0;
    }
    .traceability-box .gutters .col dl dd {
        text-align: left;
        font-size: 15px;
        margin-top: 20px;
    }
}

@media screen and (max-width: 639px) {
    .traceability-box .gutters .col dl dt {
        font-size: 18px;
        text-align: left;
        padding: 0 0 0 0;
    }
    .traceability-box .gutters .col dl dd {
        text-align: left;
        font-size: 14px;
        margin-top: 10px;
    }
}


.traceability-box-02 h3 {
    font-size: 18px;
    line-height: 1;
    font-weight: bold;
}
.traceability-box-02 .col-l-4 {
    padding-left: 40px;
}
.traceability-box-02 p {
    margin-top: 20px;
}
@media screen and (max-width: 639px) {
    .traceability-box-02 h3 {
        font-size: 16px;
    }
    .traceability-box-02 .col-l-4 {
        padding-left: 0;
        margin-top: 10px;
    }
    .traceability-box-02 .col-l-4 img {
        width: 100%;
    }
    .traceability-box-02 p {
        margin-top: 15px;
    }
}


.traceability-box-03 {
    margin-top: 50px;
}
.traceability-box-03 .col span {
    display: block;
    margin-top: 5px;
}

@media screen and (max-width: 1023px) {
    .traceability-box-03 .col span {
        font-size: 12px;
    }
}

@media screen and (max-width: 639px) {
    .traceability-box-02 h3 {
        font-size: 16px;
    }
    .traceability-box-02 .col-l-4 {
        padding-left: 0;
        margin-top: 10px;
    }
    .traceability-box-02 .col-l-4 img {
        width: 100%;
    }
    .traceability-box-02 p {
        margin-top: 15px;
    }
}


.traceability-box-04 {
    background-image: url(../img/philosophy/traceability_img_02.png);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto 100%;
    width: 100%;
    display:inline-block;
}
.traceability-box-04 .box {
    width: 37.14%;
}
.traceability-box-04 .box h3 span {
    font-size: 36px;
    font-weight: bold;
    padding-right: 10px;
}
.traceability-box-04 .box h3 {
    font-size: 22px;
}
.traceability-box-04 .box-03 h3 {
    color: #927912;
}
.traceability-box-04 .box-01,
.traceability-box-04 .box-03 {
    float: right;
}
.traceability-box-04 .box-02,
.traceability-box-04 .box-04 {
    float: left;
}
.traceability-box-04 .box-01 {
    margin-top: 7px;
}
.traceability-box-04 .box-02 {
    margin-top: 147px;
}
.traceability-box-04 .box-03,
.traceability-box-04 .box-04 {
    margin-top: 60px;
}

@media screen and (max-width: 1023px) {
    .traceability-box-04 .box h3 span {
        font-size: 22px;
    }
    .traceability-box-04 .box h3 {
        font-size: 14px;
    }
}
@media screen and (max-width: 639px) {
    .traceability-box-04 {
        background-image: none;
    }
    .traceability-box-04 .box {
        width: 100%;
        float: none;
    }
    .traceability-box-04 .box + .box {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .traceability-box-04 .box h3 {
        margin: 10px 0 0 0;
    }
    .traceability-box-04 .box-01,
    .traceability-box-04 .box-02,
    .traceability-box-04 .box-03,
    .traceability-box-04 .box-04 {

    }

}


.img-profile {
    height: 300px;
    border-radius: 7px;
    position:relative;
    background-position: center left;
    background-size: cover;
}

/* 自然素材へのこだわり */
.page-template-page-philosophy_traceability .img-profile,
.page-template-page-en-philosophy_traceability .img-profile,
.page-template-page-sustainability_farm .img-profile {
    background-image: url(../img/philosophy/traceability_pic_19.jpg);

}

.img-profile .img-profile-inner {
    width: 392px;
    height: 300px;
    position:absolute;
    right: 0;
    background-color: rgba(84, 159, 175, 0.80);
    background-image: url(../img/common/ttl_bg_herb.png);
    background-position: center bottom;
    background-size: 50% auto;
    background-repeat: no-repeat;
    text-align: center;
    color: #fff;
    padding: 86px 0 0 0;
    border-radius: 0 7px 7px 0;
}
.img-profile .img-profile-inner .info {
    font-size: 24px;
    line-height:1.2;
}
.img-profile .img-profile-inner .name {
    font-size: 16px;
}
.img-profile .img-profile-inner .name span {
    font-size: 32px;
    padding-left: 20px;
}
@media screen and (max-width: 1023px) {
    .img-profile {
        height: 200px;
        border-radius: 7px;
        position:relative;
    }
    .img-profile .img-profile-inner {
        width: 40%;
        height: 200px;
        padding: 50px 0 0 0;
    }
    .img-profile .img-profile-inner .info {
        font-size: 18px;
    }
    .img-profile .img-profile-inner .name {
        font-size: 14px;
    }
    .img-profile .img-profile-inner .name span {
        font-size: 26px;
        padding-left: 10px;
    }
}
@media screen and (max-width: 639px) {
    .img-profile {
        width: 100%;
        height: 200px;
        border-radius: 0;
        position:relative;
        background-position: center left;
        background-size: auto 100%;
        margin-bottom: 170px;
    }
    .img-profile .img-profile-inner {
        width: 100%;
        height: 110px;
        top: 200px;
        display: block;
        background: rgba(84,159,175,1.00);
        border-radius: 0;
        padding: 20px 0 0 0;
    }
    .img-profile .img-profile-inner .info {
        font-size: 16px;
    }
    .img-profile .img-profile-inner .name {
        font-size: 12px;
        margin-top: 0;
    }
    .img-profile .img-profile-inner .name span {
        font-size: 28px;
        padding-left: 10px;
    }
}



/*
   ネイチャーズウェイとは (一部 採用情報)
====================================================================================================*/
.logo-size {
    width: 155px;
}
@media screen and (max-width: 639px) {
    .logo-size {
        width: 90px;
    }
}

.company-con {
    position: relative;
    margin: 90px 0 0 0;
}
.company-con + .company-con {
    margin: 60px 0 0 0;
}
.company-con a {
    color: #ffffff !important;
}
.company-con .img {
    position: relative;
    height: 390px;
    width: 700px;
    border-radius: 7px;
}
.company-con.con-01 .img,
.company-con.con-03 .img,
.company-con.con-05 .img {
    text-align:left;
}
.company-con.con-02 .img,
.company-con.con-04 .img,
.company-con.con-06 .img {
    margin: 0 0 0 324px;
}
.company-con .text {
    width: 372px;
    position: relative;
    background: rgba(84,159,175,0.80);
    text-align: center;
    padding: 40px 35px 35px;
}
.company-con.con-01 .text,
.company-con.con-03 .text,
.company-con.con-05 .text {
    position: absolute;
    right: 0;
    bottom: 50px;
}
.company-con.con-02 .text,
.company-con.con-04 .text,
.company-con.con-06 .text {
    position: absolute;
    left: 0;
    bottom: 50px;
}
.company-con .text-01 {
    font-size: 24px;
    font-weight: bold;
    line-height: 1;
}
.company-con .text-02 {
    font-size: 14px;
    font-weight: normal;
    margin-top: 20px;
    line-height: 1.5;
}
.company-con .text-03 {
    font-size: 20px;
    margin-top: 10px;
}
.company-con .text.pad-l a {
    padding: 60px 35px 55px;
}

@media screen and (max-width: 1023px) {
    .company-con {
        margin: 70px 0 0 0;
    }
    .company-con + .company-con {
        margin: 50px 0 0 0;
    }
    .company-con .img {
        width: 70%;
    }
    .company-con.con-02 .img,
    .company-con.con-04 .img,
    .company-con.con-06 .img {
        margin: 0 0 0 30%;
    }
    .company-con .text {
        width: 51%;
    }
    .company-con .text a {
        padding: 20px;
    }
    .company-con.con-01 .text,
    .company-con.con-02 .text,
    .company-con.con-03 .text,
    .company-con.con-04 .text,
    .company-con.con-05 .text {
        bottom: 10%;
    }
    .company-con .text-01 {
        font-size: 22px;
    }
    .company-con .text-02 {
        font-size: 14px;
        margin-top: 25px 20px 20px;
    }
    .company-con .text-03 {
        font-size: 18px;
        margin-top: 10px;
    }
    .company-con .text.pad-l a {
        padding: 50px 20px 45px;
    }
}
@media screen and (max-width: 639px) {
    .company-con {
        margin: 40px 0 0 0;
    }
    .company-con + .company-con {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .company-con .img {
        width: 100%;
    }
    .company-con.con-02 .img,
    .company-con.con-04 .img,
    .company-con.con-06 .img {
        margin: 0 0 0 0;
    }
    .company-con .text {
        width: 100%;
        background: rgba(84,159,175,1.00);
		border-radius: 0 0 7px 7px;
    }
    .company-con.con-01 .text,
    .company-con.con-02 .text,
    .company-con.con-03 .text,
    .company-con.con-04 .text,
    .company-con.con-05 .text {
        position: relative;
        bottom: 0;
        margin-top: -10px;
    }
    .company-con .text-01 {
        font-size: 20px;
    }
    .company-con .text-02 {
        font-size: 12px;
        margin-top: 10px;
    }
    .company-con .text-03 {
        font-size: 14px;
        margin-top: 10px;
    }
    .company-con .text.pad-l a {
        padding: 20px;
    }
}



/*
   事業案内
====================================================================================================*/

.business-con {
    position: relative;
    margin: 100px 0 0 0;
}
.business-con + .business-con {
    margin: 60px 0 0 0;
}
.business-con .img {
    position: relative;
}
.business-con .img img {
    width: 470px;
}
.business-con .text {
    width: 595px;
    position: relative;
    padding: 50px 30px;
    background: #ffffff;
    border-radius: 5px;
    margin: -175px 0 0 389px;
}
.business-con .text .col {
    text-align: center;
    margin-top: 50px;
}
.business-con .text .col .brand-logo {

}
.business-con .text .col .brand-logo img {
    max-width: 180px;
    max-height: 130px;
}
/*
.business-con .text .col .brand-logo.mark img {
    max-height: 100px;
}
*/
.business-con .text .col .brand-name {
    font-size: 14px;
    line-height: 1.5;
    margin-top: 10px;
}
.business-con.con03 .text .col:nth-child(4) .brand-logo {
    padding:16px 0;
}


@media screen and (max-width: 1023px) {
    .business-con {
        margin: 70px 0 0 0;
    }
    .business-con + .business-con {
        margin: 50px 0 0 0;
    }
    .business-con .img img {
        width: 60%;
    }
    .business-con .text {
        width: 70%;
        padding: 30px;
        margin: -80px auto 0;
        float: right;
    }
    .business-con .text .col .brand-name {
        font-size: 12px;
        line-height: 1.5;
        margin-top: 10px;
    }
}
@media screen and (max-width: 639px) {
    .business-con {
        margin: 40px 0 0 0;
    }
    .business-con + .business-con {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .business-con .img img {
        width: 100%;
    }
    .business-con .text {
        width: 100%;
        margin: 0;
        float: none;
        padding: 20px 0 0;
    }
    .business-con .text .col .brand-logo img {
        max-width: 50%;
        max-height: auto;
    }
    .business-con.con03 .text .col:nth-child(4) .brand-logo {
        padding: 0;
    }
}



/*
   品質・安全性への取り組み
====================================================================================================*/

.quality-box {
    position: relative;
    margin-top: 80px;
}
.quality-box ul + span {
    background: url(../img/common/figure-arrow_02.png) no-repeat center center;
    background-size: contain;
    display: block;
    margin: 30px auto 0;
    height: 25px;
    width: 811px;
}
.quality-box ul {
    margin-left: -1.13%;
    margin-top: -18px;
}
.quality-box ul li {
    position: relative;
    margin-left: 1.13%;
    margin-top: 18px;
    width: 21.68%;
    border: 1px solid #afd9e3;
    border-radius: 7px;
    background-color: #ffffff;
    text-align: center;
    background: url(../img/common/icon_arrow_03.png) no-repeat center bottom;
    float: left;
}

.en .quality-box ul li {
    position: relative;
    margin-left: 1.13%;
    margin-top: 18px;
    width: 21.68%;
    border: 1px solid #afd9e3;
    border-radius: 7px;
    background-color: #ffffff;
    text-align: center;
    background-image: url(../img/common/icon_arrow_03.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    float: left;
}

.quality-box ul li + span {
    background: url(../img/common/figure-arrow_01.png) no-repeat 0 0;
    background-size: contain;
    display: block;
    width: 1.78%;
    height: 16px;
    float: left;
    margin-left: 1.13%;
    margin-top: 140px;
}
.quality-box ul li a {
    display: block;
    padding:30px 10px 70px;
}


.quality-box ul li a:hover {
    background-color: #e7f4f7;
}
.quality-box ul li dl dt {
    color: #549faf;
    font-size: 24px;
    font-weight: bold;
}
.quality-box ul li dl dt span {
    font-size: 16px;
    font-style: italic;
    font-weight: normal;
    display: block;
}
.quality-box ul li dl dd {
    margin-top: 10px;
    font-size: 16px;
    line-height: 1.7;
}

@media screen and (max-width: 1023px) {
    .quality-box {
        margin-top: 60px;
    }
    .quality-box ul + span {
        margin: 20px auto 0;
        width: 80%;
    }
    .quality-box ul li + span {
        margin-top: 120px;
    }
    .quality-box ul li a {
        display: block;
        padding:30px 5px 60px;
    }
    .quality-box ul li dl dt {
        font-size: 20px;
    }
    .quality-box ul li dl dt span {
        font-size: 14px;
    }
    .quality-box ul li dl dd {
        font-size: 14px;
    }
}

@media screen and (max-width: 639px) {
    .quality-box {
        margin-top: 40px;
    }
    .quality-box ul + span {
        display: none;
    }
    .quality-box ul {
        margin-left: 0;
        margin-top: -10px;
    }
    .quality-box ul li {
        margin-left: 0;
        margin-top: 10px;
        width: 100%;
        float: none;
    }
    .quality-box ul li + span {
        display: none;
    }
    .quality-box ul li a {
        padding: 15px 10px 35px;
    }
    .quality-box ul li dl dd {
        margin-top: 0;
    }
}

.quality-box-02 {
    background-color: #ffffff;
    border-radius: 7px;
    padding: 50px;
}
.quality-box-02 section + section {
    margin: 50px 0 0 0;
    border-top: 1px solid #e6e6e6;
    padding: 55px 0 0 0;
}
.quality-logo-sgs {
    margin: 30px auto 0;
    background-color: #ffffff;
    padding: 10px;
    width: 100px;
}

@media screen and (max-width: 1023px) {
    .quality-box-02 {
        padding: 40px;
    }
    .quality-box-02 section + section {
        margin: 40px 0 0 0;
        padding: 40px 0 0 0;
    }
}

@media screen and (max-width: 639px) {
    .quality-box-02 {
        padding: 30px 20px;
    }
}



/*
   サイトマップ
====================================================================================================*/

.sitemap-box .col a:hover {
    text-decoration: underline;
}
.sitemap-box .col > ul > li {
    font-size: 18px;
    font-weight: bold;
}
.sitemap-box .col > ul > li + li {
    margin: 20px 0 0 0;
}
.sitemap-box .col > ul > li > ul,
.sitemap-box .col > ul > li > span {
    font-size: 14px;
    font-weight: normal;
}
.sitemap-box .col > ul > li > ul {
    margin: 10px 0 0 20px;
}
.sitemap-box .col > ul > li > ul > li > a,
.sitemap-box .col > ul > li > ul > li > ul > li > a {
    background-image: url(../img/common/icon_arrow_04.png);
    background-repeat: no-repeat;
    background-size: 4px 9px;
    background-position: 0 4px;
    padding: 0 0 0 20px;
}
.sitemap-box .col > ul > li > ul > li.external > a::after,
.sitemap-box .col > ul > li > ul > li > ul > li.external > a::after {
    content: url(../img/common/icon_site_s.png);
    display: inline-block;
    margin-left: 5px;
}
.sitemap-box .col > ul > li > ul > li + li {
    margin: 5px 0 0 0;
}
.sitemap-box .col > ul > li > ul > li > ul > li {
    margin: 5px 0 0 15px;
}
.sitemap-box .col > ul > li > ul > li > ul {
    margin: 0 0 15px 0;
}
.sitemap-box .col > ul > li > ul > span  {
    margin: 10px 0 10px 0;
    display: block;
}
.sitemap-box .col > ul > li:nth-child(2) > ul > li {
    margin: 5px 0 0 0;
}
/*.sitemap-box .col .onlineshop:after {
    content:" ";
    display:inline-block;
    width:18px;
    height:18px;
    background:url(../img/common/icon_site.png);
    background-size:contain;
    vertical-align:middle;
    margin: 0 0 3px 10px;
}*/



/*
   ポリシー
====================================================================================================*/
/*
   policy-contact
------------------------------ */
.policy-contact {
    border-radius: 7px;
    padding: 20px 30px;
    margin: 20px 0 0 0;
    display: table;
    width: 100%;
    background: #e8f4f7;
    position: relative;
}
.policy-contact dt {
    display: table-cell;
    width: 130px;
    font-size: 18px;
}
.policy-contact dd {
    display: table-cell;
    font-size: 14px;
}

@media screen and (max-width: 639px) {
    .policy-contact {
        padding: 20px;
        display: block;
    }
    .policy-contact dt {
        display: block;
        width: 100%;
        font-size: 16px;
    }
    .policy-contact dd {
        display: block;
        margin: 5px 0 0 0;
        border-top: 1px solid #e6e6e6;
        padding: 5px 0 0 0;
    }
}



/*
   会社の魅力
====================================================================================================*/

/* .welfare-box .gutters {
    margin-left: -1.88%;
    margin-top: -18px;
} */
.welfare-box .gutters .col {
    position: relative;
    border: 1px solid #afd9e3;
    border-radius: 7px;
}
.welfare-box .gutters .col dl {
    padding: 45px 30px;
}
.welfare-box .gutters .col dl dt {
    color: #549faf;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
}
.welfare-box .gutters .col dl dd {
    font-size: 15px;
    line-height: 1.8;
    margin-top: 25px;
}

.work-life-box {
    border-radius: 7px;
    padding: 50px;
}

.work-life-box .heading-05 {
    margin: 0 0 20px 0;
}

.office-col .title {
    font-size: 18px;
    margin: 45px 0 0 0;
    font-weight: bold;
    display: block;
    line-height: 1.3;
}

.office-col a {
    color: #549faf;
}

@media screen and (max-width: 1023px) {
    .welfare-box .gutters {
        margin-left: 0;
        margin-top: -18px;
    }
    .welfare-box .gutters .col {
        margin-left: 0;
        margin-top: 18px;
        width: 100%;
        height: auto;
        padding: 20px;
    }
    .welfare-box .gutters .col dl {
        padding: 0;
    }
    .welfare-box .gutters .col dl dt {
        font-size: 18px;
        text-align: center;
        padding: 0 0 0 0;
    }
    .welfare-box .gutters .col dl dd {
        text-align: center;
        font-size: 15px;
        margin-top: 20px;
    }
}

@media screen and (max-width: 639px) {
    .welfare-box .gutters .col dl dt {
        font-size: 18px;
        padding: 0 0 0 0;
    }
    .welfare-box .gutters .col dl dd {
        font-size: 14px;
        margin-top: 10px;
    }

}

/*
   教育カリキュラム
====================================================================================================*/

.training-box + .training-box {
    margin-top: 60px;
}
.training-box .col {
    width: 26.67%;
    float: left;
}
.training-box .col-02 {
    float: left;
    margin-left: 4.76%;
    width: 68.57%
}

@media screen and (max-width: 639px) {
    .training-box + .training-box {
        margin: 40px 0 0 0;
        border-top: 1px solid #c4c4c4;
        padding: 45px 0 0 0;
    }
    .training-box .col {
        width: 100%;
        float: none;
    }
    .training-box .col-02 {
        float: none;
        margin-left: 0;
        width: 100%;
        margin-top: 30px;
    }
}

/*youtube埋め込み(2017/08/21)
====================================================================================================*/
.m-youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.m-youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}

/* HOME Brands リスト(2019/03/18)
====================================================================================================*/
.m-brands-list {
    max-width: 450px;
}
.m-brands-list ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin:0 auto;
}
.m-brands-list ul li {
    width: 110px;
    margin: 40px 0 0 40px;
}
.m-brands-list ul li span a {
    display: block;
    background-color: #72b0bd;
    text-align: center;
    line-height: 1;
    color: #fff;
    padding: 5px 0;
    margin-top: 3px;
}
.m-brands-list ul li span a:hover {
    background-color: #2e8598;
}
@media screen and (max-width: 1063px) {
    .m-brands-list {
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width: 639px) {
    .m-brands-list {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* 英語ページ ヘッダー */

.language-select {
    display: table-cell;
    vertical-align: middle;
    font-size: 0;
    white-space: nowrap;
}

.language-select:last-child {
    padding-right: 50px;
}

.language-select li {
    display: inline;
    font-weight: 400;
    font-size: 20px;
}

@media screen and (max-width: 1310px) {
    .language-select li {
        font-size: 18px;
    }
}

.language-select li a {
    color: #a4a0a0;
}

.language-current {
    color: #2e8598;
    border-bottom: 1px solid #2e8598;
}

.languege-separate {
    margin: 0 10px;
    border: 0;
    border-left: 1px;
    width: 1px;
    height: 13px;
    border: 0;
    border-radius: .5px;
    background-color: #a4a0a0;
    display: inline-block;
}



/*
   202105 追加 CSS
====================================================================================================*/
.img-2column-01 {
    display: flex;
    justify-content: center;
    margin: 70px 0 0 0;
}
.img-2column-01 > * {
    width: 160px;
}
@media screen and (max-width: 767px) {
    .img-2column-01 {
        margin: 35px 0 0 0;
    }
}

.img-2column-02 {
    display: flex;
    justify-content: space-between;
}
.img-2column-02 .e-img {
    width: 460px;
    margin: 40px 75px 0 0;
}
.img-2column-02 .e-text {
    flex: 1;
}
@media screen and (max-width: 1023px) {
    .img-2column-02 {
        display: block;
    }
    .img-2column-02 .e-img {
        margin: 0 auto;
    }
    .img-2column-02 .e-text {
        margin: 40px 0 0 0;
    }
}
@media screen and (max-width: 767px) {
    .img-2column-02 .e-img {
        width: 100%;
    }
    .img-2column-02 .e-text {
        margin: 30px 0 0 0;
    }
}


.dl-block-01 {
    border: 1px solid #afd9e3;
    border-radius: 7px;
    padding: 35px 35px 20px;
    background-color: #ffffff;
}
.dl-block-01 dl {
    padding: 15px 10px;
    display: flex;
    justify-content: space-between;
    text-align: left;
    border-top: 1px solid #e6e6e6;
    font-size: 16px;
}
.dl-block-01 dl:first-child {
    border-top: none;
}
.dl-block-01 dl dt {
    color: #549faf;
    width: 280px;
    letter-spacing: -0.05em;
}
.dl-block-01 dl dd {
    flex: 1;
}
.dl-block-01 dl dd .e-caution {
    font-size: 12px;
    line-height: 1.3;
    margin-top: 10px;
}
@media screen and (max-width: 767px) {
    .dl-block-01 {
        padding: 20px 20px 10px;
    }
    .dl-block-01 dl {
        padding: 10px 5px;
        display: block;
        font-size: 14px;
    }
}


.dl-block-02 dl dt {
    text-align: center;
    font-size: 24px;
    color: #549faf;
    margin-bottom: 30px;
}
.dl-block-02 dl dd {
    font-size: 18px;
}
.dl-block-02.v-color dl dd {
    color: #c53f4c;
}
@media screen and (max-width: 767px) {
    .dl-block-02 dl dt {
        font-size: 20px;
        margin-bottom: 15px;
    }
    .dl-block-02 dl dd {
        font-size: 16px;
    }
}


.ul-block-01 {
    background-color: #fafafa;
    border-radius: 7px;
    padding: 30px 40px;
}
.ul-block-01 ul li + li  {
    margin: 10px 0 0 0;
}
@media screen and (max-width: 767px) {
    .ul-block-01 {
        padding: 15px 20px;
    }
}


.box-2column-01 {
    display: flex;
    justify-content: space-between;
}
.box-2column-01 > * {
    width: 490px;
    border: 1px solid #afd9e3;
    border-radius: 7px;
    padding: 50px;
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: 240px auto;
    background-color: #ffffff;
}
.box-2column-01 .e-box1 {
    background-image: url(../img/sustainability/recycling/recycling_bg_02.png);
}
.box-2column-01 .e-box2 {
    background-image: url(../img/sustainability/recycling/recycling_bg_01.png);
}
@media screen and (max-width: 1499px) {
    .box-2column-01 > * {
        width: 470px;
    }
}
@media screen and (max-width: 1023px) {
    .box-2column-01 > * {
        width: 350px;
        padding: 30px;
    }
}
@media screen and (max-width: 767px) {
    .box-2column-01 {
        display: block;
    }
    .box-2column-01 > * {
        width: 100%;
        padding: 20px;
        background-size: 180px auto;
    }
    .box-2column-01 > * + * {
        margin: 20px 0 0 0;
    }
}


.box-4column-01 > ul {
    display: flex;
    justify-content: space-between;
}
.box-4column-01 > ul > li {
    border: 1px solid #afd9e3;
    border-radius: 7px;
    padding: 40px 20px;
    margin: 0 0 0 20px;
    width: calc((100% - 60px) / 4);
    background-color: #ffffff;
}
.box-4column-01 > ul > li:first-child {
    margin: 0;
}
.box-4column-01 > ul > li dl dt {
    font-size: 22px;
    color: #549faf;
    font-weight: bold;
    text-align: center;
    line-height: 1.3;
    margin: 0 0 20px 0;
}
.box-4column-01 > ul > li dl dd li {
    padding-left: 1em;
    text-indent: -1em;
    margin: 10px 0 0 0;
}
.box-4column-01 > ul > li dl dd div {
    margin: 10px 0 0 0;
    padding-left: 1em;
}
@media screen and (max-width: 1499px) {
    .box-4column-01 > ul > li dl dt br {
        display: none;
    }
}
@media screen and (max-width: 1023px) {
    .box-4column-01 > ul {
        flex-wrap: wrap;
        margin: -20px 0 0 0;
    }
    .box-4column-01 > ul > li {
        margin: 20px 0 0 0;
        width: calc((100% - 20px) / 2);
    }
    .box-4column-01 > ul > li:first-child {
        margin: 20px 0 0 0;
    }
}
@media screen and (max-width: 767px) {
    .box-4column-01 > ul > li {
        padding: 20px 10px;
        width: 100%;
    }
}


.table-block-01 table {
    line-height: 1.5;
    width: 100%;
    border-collapse: collapse;
}
.table-block-01 table thead tr {
    background-color: #fafafa;
    text-align: left;
}
.table-block-01 table thead tr th {
    padding: 15px 20px;
}
.table-block-01 table tbody tr th,
.table-block-01 table tbody tr td {
    border-bottom: 1px solid #e6e6e6;
}
.table-block-01 table tbody tr td:first-child {
    text-align: left;
    font-size: 18px;
    letter-spacing: -0.05em;
    width: 290px;
    padding: 0 20px;
}
.table-block-01 table tbody tr td {
    letter-spacing: -0.05em;
    padding: 15px 0;
    background-color: #ffffff;
}
.table-block-01 table tbody tr td:nth-of-type(2) {
    width: 380px;
    font-size: 16px;
}
.table-block-01 table tbody tr td dl {
    display: flex;
    align-items: center;
}
.table-block-01 table tbody tr td dl br {
    display: none;
}
.table-block-01 table tbody tr td dl dt {
    width: 60px;
}
.table-block-01 table tbody tr td dl dd {
    flex: 1;
}
@media screen and (max-width: 1023px) {
    .table-block-01 table thead tr th {
        padding: 15px 10px;
    }
    .table-block-01 table tbody tr td:first-child {
        font-size: 16px;
        width: 220px;
        padding: 0 10px;
    }
    .table-block-01 table tbody tr td:nth-of-type(2) {
        width: 290px;
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    .table-block-01 {
        overflow-x: scroll;
    }
    .table-block-01 table {
        width: 728px;
    }
}


.link-block-01 {
    display: flex;
    justify-content: space-between;
    margin: 100px 0 0 0;
}
.link-block-01 > * {
    width: calc((100% - 80px) / 3);
    margin: 0 0 0 40px;
}
.link-block-01 > *:first-child {
    margin: 0;
}
.link-block-01 dl {
    margin: 30px 0 0 0;
}
.link-block-01 dl dt {
    text-align: center;
    color: #549faf;
    font-size: 24px;
}
.link-block-01 dl dt span {
    font-size: 16px;
    display: block;
    margin: -15px 0 0 0;
}
.link-block-01 dl dd {
    margin: 10px 0 0 0;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: -0.05em;
}
.link-block-01 ul {
    margin: 30px 0 0 0;
    font-size: 16px;
}
.link-block-01 ul li + li {
    margin: 10px 0 0 0;
}
.link-block-01 ul li span {
    display: block;
    border: 1px solid #e6e6e6;
    border-radius: 4px;
    padding: 10px 20px;
}
.link-block-01 ul li a {
    display: block;
    border: 1px solid #afd9e3;
    border-radius: 4px;
    padding: 10px 20px;
    color: #549faf;
    background-image: url(../img/sustainability/commitment/commitment_arrow_01.png);
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 6px auto;
}
.link-block-01 ul li a:hover {
    background-color: #afd9e3;
    color: #ffffff;
    background-image: url(../img/sustainability/commitment/commitment_arrow_02.png);
}
@media screen and (max-width: 1023px) {
    .link-block-01 {
        margin: 50px 0 0 0;
    }
    .link-block-01 > * {
        width: calc((100% - 40px) / 3);
        margin: 0 0 0 20px;
    }
    .link-block-01 dl {
        margin: 20px 0 0 0;
    }
    .link-block-01 dl dt {
        font-size: 20px;
    }
    .link-block-01 dl dd {
        font-size: 14px;
        height: 63px;
    }
    .link-block-01 ul {
        margin: 20px 0 0 0;
        font-size: 14px;
    }
}
@media screen and (max-width: 767px) {
    .link-block-01 {
        display: block;
    }
    .link-block-01 > * {
        width: 100%;
        margin: 0;
    }
    .link-block-01 > * + * {
        margin: 30px 0 0 0;
    }
    .link-block-01 dl {
        margin: 10px 0 0 0;
    }
    .link-block-01 dl dd {
        height: auto;
    }
    .link-block-01 ul {
        margin: 10px 0 0 0;
    }
    .link-block-01 ul li span {
        padding: 10px 15px;
    }
    .link-block-01 ul li a {
        padding: 10px 15px;
        color: #549faf;
        background-position: right 15px center;
        background-size: 4px auto;
    }
}


.terracyclepoint-block-01 {
    margin: 30px 0 0 0;
}
@media screen and (max-width: 1023px) {
    .terracyclepoint-block-01 svg {
        width: 100%;
        height: auto;
    }
}
.terracyclepoint-block-02 {
    border: 1px solid #e6e6e6;
    border-radius: 7px;
    padding: 40px 0;
    display: flex;
    justify-content: space-between;
    background-color: #ffffff;
}
.terracyclepoint-block-02 > * {
    width: 50%;
    text-align: center;
}
.terracyclepoint-block-02 dl dt {
    font-size: 18px;
    font-weight: bold;
}
.terracyclepoint-block-02 dl dd {
    font-size: 16px;
    margin: -5px 0 0 0;
}
.terracyclepoint-block-02 .e-link-img {
    width: 220px;
    display: inline-block;
    margin: 20px 0 0 0;
}
.terracyclepoint-block-02 .e-link-text {
    margin: 20px 0 0 0;
    font-size: 16px;
}
.terracyclepoint-block-02 .e-link-text img {
    width: 14px;
    height: auto;
    vertical-align: middle;
    margin: 0 5px 0 0;
}
.terracyclepoint-block-02 .e-link-text a {
    text-decoration: underline;
}
.terracyclepoint-block-02 .e-link-text a:hover {
    text-decoration: none;
}
@media screen and (max-width: 1023px) {
    .terracyclepoint-block-02 {
        padding: 20px 0;
        display: block;
    }
    .terracyclepoint-block-02 > * {
        width: 100%;
    }
    .terracyclepoint-block-02 > * + * {
        margin: 30px 0 0 0;
    }
    .terracyclepoint-block-02 .e-link-img {
        margin: 10px 0 0 0;
    }
    .terracyclepoint-block-02 .e-link-text {
        margin: 10px 0 0 0;
    }
}


.loop-item-block {
    display: flex;
    justify-content: space-between;
    margin: 70px 0 0 0;
}
.loop-item-block.v-02 {
    border-top: 1px solid #e6e6e6;
    padding: 30px 0 0 0;
    margin: 30px 0 0 0;
}
.loop-item-block .e-main {
    width: 570px;
    margin: 0 70px 0 0;
}
.loop-item-block .e-main h2 {
    margin: 0 0 40px 0;
    font-size: 24px;
}
.loop-item-block .e-main h2 img {
    width: 97px;
    vertical-align: inherit;
    margin: 0 0 0 20px;
}
.loop-item-block.v-02 .e-main h2 img {
    width: 215px;
}
.loop-item-block .e-main ul {
    font-size: 12px;
    margin: 30px 0 0 0;
}
.loop-item-block .e-sub {
    flex: 1;
}
.loop-item-block .e-sub .m-name {
    font-size: 12px;
    line-height: 1.5;
    margin: 10px 0 0 0;
}
.loop-item-block .e-sub .m-caution {
    font-size: 10px;
    line-height: 1.7;
    margin: 5px 0 0 0;
}
.loop-item-block .e-sub .m-note {
    font-size: 10px;
    line-height: 1.7;
    margin: 15px 0 0 0;
}
@media screen and (max-width: 1023px) {
    .loop-item-block .e-main {
        width: 450px;
        margin: 0 35px 0 0;
    }
}
@media screen and (max-width: 767px) {
    .loop-item-block {
        display: block;
        margin: 35px 0 0 0;
    }
    .loop-item-block.v-02 {
        padding: 20px 0 0 0;
        margin: 20px 0 0 0;
    }
    .loop-item-block .e-main {
        width: 100%;
        margin: 0;
    }
    .loop-item-block .e-main h2 {
        margin: 0 0 20px 0;
        font-size: 18px;
    }
    .loop-item-block .e-main h2 img {
        width: 65px;
        margin: -3px 0 0 10px;
    }
    .loop-item-block.v-02 .e-main h2 img {
        width: 150px;
    }
    .loop-item-block .e-main ul {
        font-size: 11px;
        margin: 20px 0 0 0;
    }
    .loop-item-block .e-sub {
        text-align: center;
    }
    .loop-item-block .e-sub .m-img {
        width: 200px;
        margin-left: auto;
        margin-right: auto;
    }
    .loop-item-block .e-sub .m-name {
        margin: 5px 0 0 0;
    }
    .loop-item-block .e-sub .m-note {
        margin: 10px 0 0 0;
    }
}


.text-block-01 {
    border: 1px solid #afd9e3;
    border-radius: 7px;
    padding: 40px 0;
    margin: 40px 0 0 0;
    text-align: center;
    background-color: #ffffff;
}
.text-block-01 > * + * {
    margin: 20px 0 0 0;
}
.text-block-01 .e-text {
    font-size: 24px;
}
@media screen and (max-width: 1023px) {
    .text-block-01 {
        padding: 40px 20px;
    }
}
@media screen and (max-width: 767px) {
    .text-block-01 {
        padding: 20px 20px;
        text-align: left;
    }
}

.loop-con img {
    display: block;
    margin: auto;
    width: 80%;
}


@media screen and (max-width: 1023px) {
    .loop-con img {
        display: block;
        margin: auto;
        width: 80%;
    }
}

@media screen and (max-width: 767px) {
    .loop-con img {
        display: block;
        margin: auto;
        width: 100%;
    }

}

/*
   202109 追加 CSS SBT認証
====================================================================================================*/
.sbt-img-01 {
    display: flex;
    justify-content: center;
    margin: 50px 0 0 0;
}
.sbt-img-01 img {
    width: 320px;
}
@media screen and (max-width: 767px) {
    .sbt-img-01 {
        margin: 35px 0 0 0;
    }
}

.sbt-description {
    margin: 0 60px;
    text-align: left;
}

.sbt-description-item {
    display: flex;
    flex-wrap: wrap;
    padding: 20px;
}

.sbt-description-item .title {
    width: 120px;
    font-weight: bold;
}

.sbt-description-item .text {
    flex: 1;
}

.sbt-description .sbt-description-item + .sbt-description-item {
    border-top: 1px solid #afd9e3;
}

@media screen and (max-width: 767px) {
    .sbt-description-item {
        display: flex;
        flex-wrap: wrap;
        padding: 20px;
        flex-direction: column;
    }
}

.sbt-img-02 {
    display: flex;
    justify-content: center;
    margin: 40px 0 0 0;
}
.sbt-img-02 img {
    width: 640px;
}

@media screen and (max-width: 1023px) {
    .text-block-01 {
        padding: 40px 20px;
    }
    .sbt-description {
        margin: 0 ;
    }
}
@media screen and (max-width: 767px) {
    .text-block-01 {
        padding: 20px 20px;
        text-align: left;
    }
    .sbt-description {
        margin: 0 ;
    }
    .sbt-img-02 {
        margin: 20px 0 0 0;
    }
}

.sbt-img-03 {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}
.sbt-img-03 img {
    width: 660px;
}
@media screen and (max-width: 767px) {
    .sbt-img-03 {
        margin: 20px 0;
    }
}

.sbt-img-2column-01 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px 0 20px 0;
}

.sbt-img-2column-01 .img-more-tree img {
    height: 420px;
    max-height: 420px;

}

.sbt-img-2column-01 .img-forest img {
    flex: 1;
    height: 420px;
    max-height: 420px;
}

@media screen and (max-width: 767px) {

    .sbt-img-2column-01 {
        margin: 20px 0 10px 0;
        flex-direction: column;
        align-items: center;
    }

    .sbt-img-2column-01 .img-more-tree img {
        flex: 1;
        height: 315px;
        max-height: 315px;
        margin-bottom: 20px;
    }

    .sbt-img-2column-01 .img-forest img {
        flex: 1;
        width: 100%;
    }
}

.sbt-more-tree-group {
    padding: 40px;
    margin-bottom: 40px;
}

.sbt-more-tree-group .heading-01 {
    text-align: left;
}

@media screen and (max-width: 767px) {
    .sbt-more-tree-group {
        padding: 20px;
        margin-bottom: 20px;
    }

    .sbt-more-tree-group .heading-01 {
        text-align: center;
    }
}

.sbt-more-tree-link-group .sbt-more-tree-link-group-item a::before {
    content: url(../img/common/icon_site_s.png);
    display: inline-block;
    margin-right: 5px;
}

.sbt-img-04 {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.sbt-img-04 figure {
    margin: 0;
}

.sbt-img-04 figure figcaption {
    text-align: right;
}

.sbt-img-04 img {
    width: 100%;
}
@media screen and (max-width: 767px) {
    .sbt-img-04 {
        margin: 20px 0;
    }
    .sbt-img-04 figure figcaption {
        text-align: left;
    }
}


/*
   202312 追加 CSS 省エネ・再エネ
====================================================================================================*/
.energy-img {
    margin: 30px auto;
    max-width: 100%;
    width: 640px;
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 15px;
}
.energy-img img {
    display: block;
}
.energy-img-02 {
    margin-top: 80px;

    @media screen and (max-width: 639px) {
        margin-top: 40px;
    }
}
.energy-note {
    margin-top: 20px;
    color: #a4a0a0;
    text-align: left;
}
body .energy-section {
    padding-bottom: 60px !important;
    
    @media screen and (max-width: 639px) {
        padding-bottom: 40px !important;
    }
}
.energy-section > *:first-child {
    margin-top: 0;
}
.energy-section > *:last-child {
    margin-bottom: 0;
}
.energy-section:not(:last-child) {
    margin-bottom: 30px;
}
.energy-section p {
    margin-left: auto;
    margin-right: auto;
    max-width: 640px;
}