@charset "UTF-8";

html {
    font-size: 62.5%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
}

body {
    width: auto;
    height: auto;
    font-size: 1.4rem;
    font-family: 'Noto Serif JP', serif;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 1px;
    color: #111;
    margin: 30px 30px 0 30px;
    padding: 0 0 30px 0;
}

.container-fluid {
    padding-right: 20px;
    padding-left: 20px;
}

@media (min-width: 992px) {
    body {
        padding-left: 0px;
    }

    .container-fluid {
        padding-left: 30px;
        padding-right: 30px;
    }
}

@media (max-width: 991px) {
    body {
        margin: 0px 0px 0 0px;
        padding: 0 0 0px 0;
    }
}

/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
    position: fixed;
    top: -30px;
    left: 0;
    width: calc(100% + 30px);
    height: calc(100% + 30px);
    z-index: 999;
    text-align: center;
    color: #666;
}

/* Loading画像中央配置　*/
#splash_text {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 999;
    transform: translate(-50%, -50%);
    color: #666;
    width: 100%;
}

/*割れる画面のアニメーション*/
.loader_cover {
    width: 100%;
    height: 50%;
    background-color: #F5F5F5;
    transition: all .5s cubic-bezier(0.86, 0, 0.07, 1);
    transform: scaleY(1);
}

/*上の画面*/
.loader_cover-up {
    transform-origin: center top;
}

/*下の画面*/
.loader_cover-down {
    position: absolute;
    bottom: 0;
    transform-origin: center bottom;
}

/*クラス名がついたらY軸方向に0*/
.coveranime {
    transform: scaleY(0);
}


a {
    color: #111;
    outline: 0;
    outline: none;
    text-decoration: none;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

a:hover {
    color: #999;
    outline: 0;
    outline: none;
    text-decoration: none;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

a:focus,
*:focus {
    outline: none;
}

a[href^="tel:"] {
    cursor: default;
}

img {
    vertical-align: middle;
    border-style: none;
    max-width: 100%;
    height: auto;
}

img.img-fluid {
    vertical-align: middle;
    border-style: none;
    max-width: 100%;
    height: auto;
}


.container-100p {
    width: 100%;
    margin: 0 auto;
}

.row:before,
.row:after {
    width: 0;
}

.row.no-margin {
    margin-right: 0;
    margin-left: 0;
}

.row.flex {
    display: flex;
    flex-wrap: wrap;
}

.no-padding {
    padding-left: 0;
    padding-right: 0;
}

.flex-center {
    display: flex;
    align-items: center;
}

.flex-row-reverse {
    display: flex;
    flex-direction: row-reverse;
}

ul {
    display: block;
    list-style-type: none;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}

h1 {
    margin: 0 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: none;
}

dt {
    font-weight: 600;
}


.fixed-top {
    position: fixed;
    z-index: 1030;
}

.d-lg-block h1 {
    font-size: 0rem;
    padding: 10px 1rem;
}


.navbar-button {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.nav-icon-wrap {
    margin-top: 40px;
    margin-left: 0;
    margin-right: 0;
    padding-left: 20%;
    padding-right: 20%;
}

.nav-link.nav-icon {
    display: block;
    font-size: 2.4rem;
    font-weight: 400;
    padding: 0 0.5rem;
    text-align: center;
}

#sidebar-menu>ul>li>a.nav-link.nav-tel {
    display: block;
    font-size: 2.2rem;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 1.0;
    margin: 10px 0 15px;
    padding: 0 1.0rem;
}

.tel-uke {
    display: block;
    font-size: 0.8rem;
    font-weight: 400;
    letter-spacing: 0;
    color: #111;
    padding: 5px 0 0;
}

#sidebar-menu>ul>li>a.btn-sm.navcontact {
    width: 60%;
    margin: 0 auto;
    padding: 0.75rem 1.0rem;
    font-size: 1.4rem;
    font-family: 'Noto Serif JP', serif;
    line-height: 1.6;
    border-radius: 0;
    box-shadow: none;
    color: #111;
    background-color: transparent;
    border-color: #111;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.btn-group-sm>.btn,
#sidebar-menu>ul>li>a.btn-sm.navcontact:hover {
    color: #FFF;
    background-color: #111;
    border-color: #111;
}



/*!------------------------------------------------------------------
[Home Hero Section]
*/

#wrapper {
    border: solid 1px #111;
}

@media (max-width: 499px) {
    #wrapper {
        border: none;
    }
}



/*!------------------------------------------------------------------
[Home Hero Section]
*/

/* スリックスライダー */
.slider li {
    width: 100%;
    height: 120vh;
    background-size: cover !important;
    background-position: center center !important;
}

/* 拡大率調整 */
@keyframes fadezoom {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.3);
    }
}

/* ズームアニメーション */
.animation {
    animation: fadezoom 15s 0s forwards;
}

.hero-wrap {
    position: relative;
    width: 100%;
    height: 120vh;
    margin: 0;
    padding: 15px;
    overflow: hidden;
}

.hero {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #FFF;
}

.hero-copy-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 80%;
}

.hero-copy-logowrap {
    display: block;
    width: 160px;
    height: auto;
}

@media (max-width: 1480px) {
    .hero-copy-logowrap {
        width: 140px;
    }
}

@media (max-width: 1380px) {
    .hero-copy-logowrap {
        width: 120px;
    }
}

@media (max-width: 749px) {
    .hero-copy-logowrap {
        width: 140px;
        height: auto;
    }
}

@media (max-width: 499px) {
    .hero-wrap {
        height: calc(100vh - 118px);
    }

    .slider li {
        height: calc(100vh - 135px);
        background-position: center center !important;
    }

    .hero-copy-wrapper {
        height: 100%;
    }

    .hero-copy-logowrap {
        width: 100px;
        height: auto;
        padding: 0 0 10%;
    }
}

/*スクロールダウン全体の場所*/
.scrolldown1 {
    /*描画位置※位置は適宜調整してください*/
    position: absolute;
    left: 50%;
    bottom: 20%;
    /*全体の高さ*/
    height: 150px;
}

/*Scrollテキストの描写*/
.scrolldown1 span {
    /*描画位置*/
    position: absolute;
    left: -15px;
    top: -15px;
    /*テキストの形状*/
    color: #FFF;
    font-size: 1.0rem;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after {
    content: "";
    /*描画位置*/
    position: absolute;
    top: 0;
    /*線の形状*/
    width: 1px;
    height: 130px;
    background: #FFF;
    /*線の動き1.4秒かけて動く。永遠にループ*/
    animation: pathmove 2.0s ease-in-out infinite;
    opacity: 0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove {
    0% {
        height: 0;
        top: 0;
        opacity: 0;
    }

    30% {
        height: 80px;
        opacity: 1;
    }

    100% {
        height: 0;
        top: 130px;
        opacity: 0;
    }
}

@media (max-width: 749px) {
    .scrolldown1 {
        bottom: 0px;
    }
}



/*!------------------------------------------------------------------
[Home About Section]
*/

.home-about-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 15px 15px 0 15px;
    padding: 8% 5% 8%;
    background-color: #FFF;
}

.home-about-title-wrapper {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-right: 10%;
}

.home-about-text-wrapper {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-left: 4%;
}

.home-about-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    margin: 0;
    padding: 0 0 70px;
}

.home-about-title-lead {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 5px;
    text-align: left;
    color: #111;
    margin: 0 0 7%;
    padding: 0;
}

.home-about-title-lead br {
    display: none;
}

.home-about-subtext {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.0;
    letter-spacing: 1px;
    text-align: left;
    color: #000;
    margin: 0 0 10%;
    padding: 0 0 0 15px;
}


@media (max-width: 1480px) {
    .home-about-title-wrapper {
        padding-right: 20%;
    }

    .home-about-text-wrapper {
        padding-left: 0;
    }
}

@media (max-width: 1480px) {
    .home-about-subtext br.br {
        display: none;
    }
}

@media (max-width: 1200px) {
    .home-about-title-wrapper {
        display: block;
        padding-right: 0;
    }

    .home-about-title {
        text-align: center;
        padding: 0 0 40px;
    }

    .home-about-title-lead {
        text-align: center;
        margin: 0 0 30px;
    }

    .home-about-subtext {
        padding: 0;
    }
}

@media (max-width: 990px) {
    .home-about-content-section {
        padding: 10% 5% 10%;
    }
}

@media (max-width: 499px) {
    .home-about-content-section {
        padding: 40px 7% 50px;
    }

    .home-about-title {
        padding: 0 0 30px;
    }

    .home-about-title-lead br {
        display: block;
    }

    .home-about-subtext {
        margin: 0;
        padding: 0 0 30px;
    }
}



/* Btn Center
 * --------------------------------------- */

.home-about-linkbutton-wrap {
    display: block;
    width: 140px;
    height: 40px;
    margin: 0 0 0 15px;
    padding: 0;
}

.home-service-linkbutton-wrap {
    display: block;
    width: 140px;
    height: 40px;
    margin: 0 auto;
    padding: 0;
}

.linkbutton-center-btn {
    display: block;
    position: relative;
    width: 140px;
    height: 40px;
    text-align: left;
    margin: 0;
    padding: 0 20px;
    background: transparent;
    line-height: 35px;
    border: solid 1px #111;
}

.linkbutton-center-btn::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    background-color: #111;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

.linkbutton-center-btn:hover::before {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}

.linkbutton-center-btn .text {
    display: inline-block;
    position: relative;
    font-size: 1.2rem;
    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 1px;
    color: #111;
    text-align: center;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-center-btn:hover {
    border: solid 1px #111;
}

.linkbutton-center-btn:hover .text {
    color: #FFF;
}

.linkbutton-center-btn .arrow {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 8px;
    border-color: transparent transparent transparent #111;
    position: absolute;
    right: 15px;
    top: 47%;
    margin-top: -3px;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-center-btn:hover .arrow {
    border-color: transparent transparent transparent #FFF;
    right: 20px;
}

@media (max-width: 1200px) {
    .home-about-linkbutton-wrap {
        margin: 0 auto;
    }

    .linkbutton-center-btn {
        margin: 0 auto;
    }
}



/*!------------------------------------------------------------------
[Home Service Section]
*/

.home-service-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 8% 5% 8%;
    background-color: #f4f2ec;
}

.home-service-left-wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.home-service-right-wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

.home-service-contents-wrap {
    display: block;
    width: 60%;
    margin: 0 auto 30px;
    padding: 0;
}

.home-service-laad-en {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 30px 2px;
}

.home-service-title {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 30px 4px;
}

@media (max-width: 1480px) {
    .home-service-contents-wrap {
        width: 70%;
    }
}

@media (max-width: 1380px) {
    .home-service-contents-wrap {
        width: 80%;
    }
}

@media (max-width: 1200px) {
    .home-service-contents-wrap {
        width: 100%;
    }
}

@media (max-width: 990px) {
    .home-service-content-section {
        padding: 10% 0 10%;
    }
}

@media (max-width: 499px) {
    .home-service-content-section {
        padding: 50px 7% 10px;
    }

    .home-service-left-wrapper {
        margin: 0 auto 40px;
    }

    .home-service-laad-en {
        font-size: 1.8rem;
        padding: 0 0 10px;
    }

    .home-service-contents-wrap {
        width: 100%;
    }
}



/*!------------------------------------------------------------------
[Home Works Section]
*/

.home-works-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 2% 8%;
    background-color: #FFF;
}

.seconds-group-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 0 2% 8%;
    background-color: #FFF;
}

.home-works-title-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 0;
    padding-right: 0;
}

.home-works-title-wrap {
    display: block;
    text-align: center;
}

.home-works-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}

.works-over-wrapper {
    margin-bottom: 30px;
}

.slider-works {
    margin-bottom: 40px;
}

.works_slide {
    height: 100%;
    padding: 8px;
    margin: 0;
    background-color: #FFF;
    border: 1px solid #EEE;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.works_slide .photo {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.works_slide .tbox {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 10px;
}

.works_slide .tbox .nbox {
    width: 100%;
    padding-bottom: 7px;
    padding-left: 5px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #CCC;
    text-align: left;
}

.works_slide .tbox .nbox div.name {
    font-size: 1.2rem;
    font-weight: 400;
    font-family: 'Noto Serif JP', serif;
    letter-spacing: 1px;
}

.works_slide .tbox p {
    width: 100%;
    font-size: 1.0rem;
    line-height: 140%;
    letter-spacing: 1px;
    margin: 0;
    padding: 5px;
    text-align: left;
}

@media (max-width: 1480px) {
    .works_slide {
        margin: 0 0 10px 0;
        padding: 6px;
    }
}

@media (max-width: 1200px) {
    .slider-works {
        margin-bottom: 20px;
    }

    .slider-works .tb-mb10 {
        margin-bottom: 30px;
    }
}

@media (max-width: 990px) {
    .home-works-content-section {
        padding: 10% 1% 10%;
    }

    .seconds-group-content-section {
        padding: 0 0 10%;
    }

    .works_slide {
        margin: 0 0 20px 0;
    }
}

@media (max-width: 499px) {
    .home-works-content-section {
        padding: 50px 5px;
    }

    .seconds-group-content-section {
        width: 100%;
        padding: 0 0 50px;
    }

    .home-works-title {
        margin: 0 0 20px;
    }

    .slider-works {
        height: auto;
        margin-bottom: 20px;
    }

    .slider-works .col-6 {
        padding-right: 4px;
        padding-left: 4px;
    }

    .slider-works .tb-mb10 {
        margin-bottom: 30px;
    }
    .works_slide {
        margin: 0;
        padding: 5px;
    }

    .works_slide .tbox .nbox div.name {
        font-size: 1.2rem;
        line-height: 1.2;
    }
}



/*!------------------------------------------------------------------
[Home Column Section]
*/

.home-column-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 2% 8%;
    background-color: #FFF;
}

.home-column-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}

.home-column-title-lead {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 40px 4px;
}

.slider-column {
    margin-bottom: 40px;
}

.column_slide {
    height: 100%;
    padding: 8px;
    margin: 0 10px;
    background-color: #FFF;
    border: 1px solid #EEE;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.column_slide .photo {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.column_slide .sub {
    margin: 0;
    padding: 15px 10px 10px 10px;
    width: 100%;
    font-size: 1.2rem;
    text-align: left;
    font-weight: 400;
    transition: .3s;
}

.column_slide .sub .cat {
    margin: 0 5px 0 0;
    padding: 3px 5px 4px;
    width: auto;
    font-size: 1.0rem;
    letter-spacing: 1px;
    color: #FFF;
    background-color: #111;
}

.column_slide .sub .date {
    margin: 0;
    padding: 0 0 0 5px;
    width: auto;
    color: #111;
    font-family: 'Montserrat', sans-serif;
}

.column_slide .title {
    display: block;
    font-size: 1.2rem;
    font-weight: 400;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    margin: 0;
    padding: 10px;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #CCC;
}

@media (max-width: 1480px) {
    .column_slide {
        padding: 6px;
        margin: 0;
    }
}

@media (max-width: 1200px) {
    .slider-column {
        margin-bottom: 20px;
    }

    .slider-column .tb-mb10 {
        margin-bottom: 30px;
    }
}

@media (max-width: 990px) {
    .home-column-content-section {
        padding: 10% 1% 10%;
    }

    .column_slide {
        margin: 0 0 20px 0;
    }
}

@media (max-width: 499px) {
    .home-column-content-section {
        padding: 50px 0;
    }

    .home-column-title {
        margin: 0 0 20px;
    }

    .slider-column {
        height: auto;
    }

    .slider-column .col-6 {
        padding-right: 4px;
        padding-left: 4px;
    }

    .slider-column .tb-mb10 {
        margin-bottom: 10px;
    }

    .column_slide {
        padding: 5px;
        margin: 0;
    }

    .column_slide .sub {
        text-align: center;
    }

    .column_slide .sub b {
        display: none;
    }

    .column_slide .sub .cat {
        margin: 0;
    }

    .column_slide .sub .date {
        display: block;
        padding: 5px 0 0;
    }
}



/*!------------------------------------------------------------------
[Home Q&A Section]
*/

.home-qanda-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 10% 8%;
    background-color: #f4f2ec;
}

.home-qanda-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}

.home-qanda-title-lead {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 40px 4px;
}

.home-qanda-content-wrapper {
    margin: 0 0 50px;
    padding: 0;
}


/*アコーディオン全体*/
.accordion-area {
    list-style: none;
    width: 100%;
    margin: 0 auto;
}

.accordion-area li {
    margin: 10px 0;
}

.accordion-area section {
    border: 1px solid #ccc;
}

/*アコーディオンタイトル*/
.accordion-area section .title {
    position: relative;
    /*+マークの位置基準とするためrelative指定*/
    cursor: pointer;
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 1px;
    text-align: left;
    color: #111;
    padding: 3% 3% 3% 70px;
    transition: all .5s ease;
}

.accordion-area section .title:hover {
    letter-spacing: 2px;
    color: #999;
}

.accordion-area section .title span {
    display: block;
    font-size: 1.4rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding: 0 0 10px;
}

/*アイコンの＋と×*/
.accordion-area section .title::before,
.accordion-area section .title::after {
    position: absolute;
    content: '';
    width: 15px;
    height: 1px;
    background-color: #333;

}

.accordion-area section .title::before {
    top: 48%;
    left: 30px;
    transform: rotate(0deg);

}

.accordion-area section .title::after {
    top: 48%;
    left: 30px;
    transform: rotate(90deg);

}

/*　closeというクラスがついたら形状変化　*/
.accordion-area section .title.closed::before {
    transform: rotate(45deg);
}

.accordion-area section .title.closed::after {
    transform: rotate(-45deg);
}

/*アコーディオンで現れるエリア*/
.accordion-area section .box {
    display: none;
    /*はじめは非表示*/
    background: #FFF;
    margin: 0 3% 3% 3%;
    padding: 3%;
}

.accordion-area section .box p {
    display: block;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 1px;
    text-align: left;
    color: #111;
    margin: 0;
    padding: 0;
}

.accordion-area section .box p span {
    display: block;
    font-size: 1.4rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding: 0 0 10px;
}

.accordion-area section .box p img.spimg {
    display: none;
}

@media (max-width: 1480px) {
    .home-qanda-content-section {
        padding: 8% 5% 8%;
    }
}

@media (max-width: 1200px) {
    .accordion-area section .title {
        font-size: 1.3rem;
    }

    .accordion-area section .box p img.pcimg {
        display: none;
    }

    .accordion-area section .box p img.spimg {
        display: block;
    }
}

@media (max-width: 990px) {
    .home-qanda-content-section {
        padding: 10% 5% 10%;
    }

    .accordion-area section .title:hover {
        letter-spacing: 0;
        color: #111;
    }
}

@media (max-width: 499px) {
    .home-qanda-content-section {
        padding: 50px 5%;
    }

    .home-qanda-content-wrapper {
        margin: 0 0 30px;
    }

    .home-qanda-title {
        margin: 0 0 20px;
    }

    .home-qanda-title-wrapper {
        margin: 0;
    }

    .accordion-area section .box {
        padding: 5%;
    }

    .accordion-area section .box p {
        line-height: 1.5;
    }
}


/* Btn
 * --------------------------------------- */
.linkbutton-left {
    display: block;
    position: relative;
    width: 200px;
    height: 40px;
    text-align: left;
    margin: 20px 0 0;
    padding: 0 20px;
    background: transparent;
    line-height: 35px;
    border: solid 1px #000;
}

.linkbutton-left::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    background-color: #111;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

.linkbutton-left:hover::before {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}

.linkbutton-left .text {
    display: inline-block;
    position: relative;
    font-size: 1.2rem;
    font-weight: 500;
    letter-spacing: 0;
    color: #111;
    text-align: center;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-left:hover {
    border: solid 1px #111;
}

.linkbutton-left:hover .text {
    color: #FFF;
}

.linkbutton-left .arrow {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 12px;
    border-color: transparent transparent transparent #111;
    position: absolute;
    right: 20px;
    top: 45%;
    margin-top: -3px;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-left:hover .arrow {
    border-color: transparent transparent transparent #FFF;
    right: 25px;
}

@media (max-width: 990px) {
    .linkbutton-left {
        margin: 20px auto 0;
    }
}



/*!------------------------------------------------------------------
[Home Parallax Section]
*/

#home-parallax-section {
    position: relative;
    width: 100%;
    height: auto;
}

.parallax {
    background-attachment: fixed !important;
}

@media (max-width: 1200px) {
}

@media (max-width: 990px) {
}

@media (max-width: 499px) {
}



/*!------------------------------------------------------------------
[Home Q&A Section]
*/

.home-news-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto 15px;
    padding: 8% 10% 8%;
    background-color: #FFF;
}

.home-news-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}

.home-news-content-wrapper {
    padding-bottom: 30px;
}

.home-news-content-wrap {
    display: block;
    margin: 0 0 30px;
    padding: 0 5% 3%;
    border-bottom: solid 1px #CCC;
}

.home-news-content-wrap .sub {
    width: 100%;
    font-size: 1.0rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    text-align: left;
    color: #888;
    margin: 0;
    padding: 8px 0 15px;
}

.home-news-content-wrap .sub .cat {
    margin: 0 5px 0 0;
    padding: 4px 5px;
    width: auto;
    color: #FFF;
    background-color: #111;
}

.home-news-content-wrap .sub .date {
    margin: 0;
    padding: 0 0 0 5px;
    width: auto;
}

.home-news-content-wrap .title {
    width: 100%;
    font-size: 1.4rem;
    text-align: left;
    line-height: 140%;
    font-weight: 500;
    transition: .3s;
    margin: 0;
    padding: 0;
}

@media (max-width: 1480px) {
    .home-news-content-section {
        padding: 8% 5% 8%;
    }
}

@media (max-width: 1200px) {
    .home-news-content-wrap .title {
        font-size: 1.3rem;
    }
}

@media (max-width: 990px) {
    .home-news-content-section {
        padding: 10% 5% 10%;
    }
}

@media (max-width: 499px) {
    .home-news-content-section {
        padding: 50px 0;
    }

    .home-news-content-wrapper {
        margin: 0;
    }

    .home-news-title {
        margin: 0 0 20px;
    }

    .home-news-title-wrapper {
        margin: 0;
    }

    .home-news-content-wrap {
        margin: 0 0 20px;
        padding: 0 5% 20px;
    }
}



/*!------------------------------------------------------------------
[Home Contact Section]
*/

.home-contact-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 3% 5%;
    background-color: #f4f2ec;
}

.contact-footertop-titlewrap {
    display: none;
}

.contact-footer-bannerwrap {
    height: 80px;
    padding-left: 0;
    padding-right: 0;
    border-right: solid 1px #C1C1C1;
}

.contact-footer-bannerwrap a {
    color: #111;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.contact-footer-bannerwrap a:hover {
    color: #999;
}

.contact-footer-bannerwrap-last {
    height: 80px;
    padding-left: 0;
    padding-right: 0;
}

.contact-footer-bannerwrap-last a {
    color: #111;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.contact-footer-bannerwrap-last a:hover {
    color: #999;
}

.contact-footer-telwrap {
    height: 80px;
    padding-left: 0;
    padding-right: 0;
}

.contact-footer-telwrap a {
    color: #111;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.contact-footer-telwrap a:hover {
    color: #999;
}

dl.contact-footer-content {
    width: 310px;
    height: 80px;
    padding: 0;
    margin: 0 auto;
}

dl.contact-footer-content dt {
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 80px;
    text-align: center;
    padding: 0;
    margin: 0;
}

dl.contact-footer-content dt img {
    width: 50px;
    height: 50px;
}

dl.contact-footer-content dd {
    display: flex;
    align-items: center;
    margin-left: 70px;
    height: 80px;
    padding: 10px 0;
}

.contact-footer-titles {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.4;
    letter-spacing: 1px;
    text-align: left;
    margin: 0;
    padding: 0;
}

.contact-footer-titles a {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.4;
    letter-spacing: 1px;
    margin: 0;
    padding: 0;
}

.contact-footer-titles span {
    display: block;
    font-size: 1.2rem;
    font-weight: 400;
    font-family: 'Noto Sans JP', sans-serif;
    padding: 5px 0 0;
    letter-spacing: 1px;
}

.contact-footer-titles span br {
    display: none;
}

@media (max-width: 1480px) {
    .contact-footer-titles {
        line-height: 1.1;
    }

    .contact-footer-titles span {
        font-size: 1.0rem;
        line-height: 1.4;
    }

    .contact-footer-titles span br {
        display: block;
    }

    dl.contact-footer-content {
        width: 220px;
    }
}

@media (max-width: 1200px) {
    .home-contact-content-section {
        padding: 5% 5%;
    }

    .contact-footer-bannerwrap {
        border-right: none;
    }
}

@media (max-width: 499px) {
    .home-contact-content-section {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: auto;
        margin: 0 auto;
        padding: 10px 7%;
        background: linear-gradient(rgba(244, 242, 236, 0.4), rgba(244, 242, 236, 1) 50%);
        z-index: 10;
    }

    .contact-footertop-titlewrap {
        display: block;
        font-size: 1.6rem;
        font-weight: 400;
        font-family: 'Roboto', sans-serif;
        line-height: 1.0;
        letter-spacing: 1px;
        color: #111;
        text-align: center;
        margin-top: 5px;
        margin-bottom: 5px;
    }

    .contact-footer-bannerwrap {
        height: auto;
    }

    .contact-footer-bannerwrap-last {
        height: auto;
    }

    .contact-footer-telwrap {
        display: none;
    }

    dl.contact-footer-content {
        width: 100%;
        height: auto;
    }

    dl.contact-footer-content.sp-left {
        border-right: solid 1px #666;
    }

    dl.contact-footer-content.sp-right {
        border-left: solid 1px #999;
    }

    dl.contact-footer-content dt {
        display: block;
        float: none;
        width: 100%;
        height: auto;
    }

    dl.contact-footer-content dd {
        display: none;
    }
}



/*!------------------------------------------------------------------
[Home Footer Section]
*/

section.footer-section {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 4% 5% 3%;
    background-color: #FFF;
}

.footer-section-content {
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

.footer-logo-wrapper {
    margin: 0;
    padding-left: 20px;
    padding-right: 20px;
}

.footer-logo-wrap {
    display: block;
    width: 260px;
    text-align: center;
    margin: 40px auto 10px;
    padding: 0;
}

.footer-logo-wrap span.en {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 2px;
    line-height: 1.4;
    color: #111;
    margin: 0 auto;
    padding: 5px 0 10px 2px;
}

.footer-logo-wrap span.jp {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0;
    line-height: 1.4;
    color: #111;
    margin: 0 auto;
    padding: 0;
}

.footer-address {
    display: block;
    font-size: 1.2rem;
    font-weight: 400;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    text-align: center;
    margin: 0 0 10px;
    padding: 0;
}

.footer-address span.footer-gmap {
    display: block;
    margin: 0;
    padding: 5px 0 0;
}

.footer-address span.footer-gmap a {
    font-size: 1.1rem;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 1.0;
    color: #111;
}

.footer-address span.footer-gmap a i {
    font-size: 1.8rem;
}

.footer-address span.footer-gmap a:hover {
    color: #2AA9E0;
}

.footer-tel-wrapper {
    padding: 0;
}

.footer-tel-wrap {
    display: block;
    margin: 0;
    padding: 0;
    text-align: left;
}

a.footer-tel {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 1px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 5px 0;
}

a.footer-tel-fax {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 1px;
    color: #111;
    text-align: center;
    margin: 0 0 40px;
    padding: 5px 0;
}

.footer-sns-menu-titles {
    position: relative;
    display: block;
    font-size: 2.4rem;
    font-weight: 600;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.0;
    letter-spacing: 0;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0;
}

.footer-sns-menu {
    display: flex;
    justify-content: center;
}

.footer-sns-menu li.sns-list {
    margin: 0;
    padding: 0;
}

.footer-sns-menu li.sns-list a {
    display: block;
    font-size: 3.0rem;
    font-weight: 400;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 10px;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.footer-sns-menu li.sns-list a:hover {
    color: #999;
}

.footer-copy-menuwrap {
    display: flex;
    justify-content: center;
    text-align: center;
    margin: 0;
    padding: 4% 0 20px;
}

.footer-copy-menu {
    display: block;
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    font-weight: 500;
    font-family: 'Noto Sans JP', sans-serif;
    color: #111;
    margin: 0;
    padding: 0 5px;
}

.footer-copy-menu a {
    display: block;
    font-size: 1.1rem;
    font-weight: 400;
    color: #111;
    margin: 0;
    padding: 0 5px;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.footer-copy-menu a:hover {
    letter-spacing: 1px;
    color: #2AA9E0;
}

.copyright {
    font-size: 1.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 0;
    line-height: 1.0;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 20px 0 10px;
}


.footer-menu-wrapper {
    padding-left: 10%;
    padding-right: 0;
}

.footer-menu-titles {
    position: relative;
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    text-align: left;
    line-height: 1.0;
    letter-spacing: 1px;
    color: #111;
    margin: 8% 0 0;
    padding: 0 0 15px;
}

.footer-menu-titles span {
    display: inline-block;
    font-size: 1.2rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    letter-spacing: 0;
    padding: 0 5px 0 0;
}

.footer-menu-titles::before {
    content: "";
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 110px;
    height: 1px;
    background-color: #CCC;
}

.footer-menu {
    display: block;
    width: 100%;
    text-align: left;
    margin: 10px auto 5%;
    padding: 0;
}

.footer-menu li.menu-list {
    display: block;
    margin: 0;
    padding: 0;
}

.footer-menu li.menu-list a {
    display: block;
    width: 100%;
    font-size: 1.2rem;
    font-weight: 400;
    color: #111;
    margin: 0;
    padding: 4px 0;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    -webkit-transition: 0.2s ease-in-out;
    -ms-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}

.footer-menu li a:hover {
    letter-spacing: 1px;
    color: #999;
}

@media (max-width: 1480px) {
    .footer-menu-wrapper {
        padding-left: 7%;
    }

    .footer-menu {
        margin: 10px auto 30px;
    }
}

@media (max-width: 1380px) {
    .footer-logo-wrap {
        width: 100%;
    }
}

@media (max-width: 1200px) {
    section.footer-section {
        padding: 8% 5% 7%;
    }

    .footer-menu-wrapper {
        padding-left: 0;
    }

    .footer-menu-titles {
        font-size: 1.2rem;
        letter-spacing: 0;
    }

    .footer-menu li.menu-list a {
        font-size: 1.0rem;
        letter-spacing: 0;
    }
}

@media (max-width: 990px) {
    .footer-logo-wrapper {
        margin: 0 0 50px;
    }

    .footer-logo-wrap {
        width: 320px;
    }

    .footer-menu-wrapper {
        padding-left: 10%;
    }

    .footer-menu-titles {
        font-size: 1.6rem;
    }
}

@media (max-width: 499px) {
    section.footer-section {
        padding: 30px 2% 120px;
        border-top: solid 1px #111;
    }

    .footer-logo-wrap {
        width: 100%;
    }

    .footer-logo-wrapper {
        margin: 0 0 30px;
    }

    .footer-menu-wrapper {
        padding-left: 0;
    }

    .footer-menu-titles {
        font-size: 1.4rem;
        padding: 0 0 8px;
    }

    .footer-menu {
        margin: 8px auto 20px;
    }

    .footer-menu li.menu-list a {
        font-size: 1.1rem;
        padding: 5px 0;
    }

    .footer-copy-menu a {
        font-size: 1.1rem;
        line-height: 1.2;
        letter-spacing: 0;
        padding: 0 4px;
    }

    .copyright {
        letter-spacing: 1px;
    }

    a.footer-tel-fax {
        margin: 0 0 110px;
    }
}



/*!------------------------------------------------------------------
[Scroll UP]
*/

#page-top a {
    display: flex;
    justify-content: center;
    align-items: center;
    background: #111;
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 1.6rem;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 0.6rem;
    transition: all 0.3s;
}

#page-top a:hover {
    background: #777;
}

/*リンクを右下に固定*/
#page-top {
    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 1;
    /*はじめは非表示*/
    opacity: 0;
    transform: translateY(150px);
    margin-bottom: 0;
}

/*　上に上がる動き　*/

#page-top.UpMove {
    animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime {
    from {
        opacity: 0;
        transform: translateY(150px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/*　下に下がる動き　*/

#page-top.DownMove {
    animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 1;
        transform: translateY(150px);
    }
}

@media (max-width: 990px) {
    #page-top {
        right: 0px;
        bottom: 0px;
    }
}

@media (max-width: 499px) {
    #page-top {
        bottom: 96px;
    }
}



/*------------------------------------------------------------------
[Second about.html]
*/

.about-content-first-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 8% 5% 10%;
    background-color: #FFF;
}

.about-first-subtext {
    display: block;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 3.0;
    letter-spacing: 2px;
    text-align: center;
    color: #000;
    margin: 0;
    padding: 0 0 0 2px;
}



/*------------------------------------------------------------------
[Second Page]
*/

/* PC */
.spOnly {
    display: none;
}

.cover {
    width: 100%;
    background-color: #FFF;
}

/* SP */
@media screen and (max-width: 1200px) {
    .pcOnly {
        display: none;
    }

    .spOnly {
        display: block;
    }

    .cover {
        width: 100%;
    }
}



/*------------------------------------------------------------------
[Second BG Title]
*/

.bg .main {
    top: 250px;
    width: 250px;
}

@media (max-width: 499px){
    .bg .main {
        width: 200px;
    }
}


/*------------------------------------------------------------------
[Pankuzu]
*/

.pankuzu p {
    width: 100%;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: 1px;
    color: #FFF;
    text-align: left;
    margin-right: auto;
    margin-left: auto;
    padding-top: 7px;
    padding-bottom: 5px;
    padding-left: 5%;
    padding-right: 5%;
}



/*------------------------------------------------------------------
[About Us]
*/

.about-first-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 6% 20px 7%;
    background-color: #f4f2ec;
}

.about-first-title-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 0 0 0 20%;
}

.about-first-text-wrap {
    width: 90%;
    margin-right: 10%;
    padding-top: 50px;
    padding-bottom: 50px;
}

.about-first-text {
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2.5;
    text-align: left;
    margin: 0;
    padding: 0;
}

.second-first-text-wrap {
    padding-top: 50px;
    padding-bottom: 50px;
}

.about-second-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 7%;
    padding: 0 0 0 2px;
}

.contact-second-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 7% 0 0;
    padding: 0 0 0 2px;
}
.cover-in-contact {
    width: 100%;
}

.about-second-titles {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}
.about-second-titles-lead {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 40px 4px;
}
.about-second-titles-lead span {
    display: block;
    font-size: 1.2rem;
    letter-spacing: 1px;
    padding: 15px 0 0;
}


.swiper-container {
  overflow: hidden;
}

.swiper-slide {
  width: 100%;
}

.slider-about {
    margin-bottom: 7%;
}

.swiper-slide.about_slide {
    margin: 0;
    padding: 0;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.works_slide .photo {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
}

.about-subtitle-wrapper01 {
    margin: 0 0 6%;
    padding: 0 5%;
}

.about-subtitle-flexwrap {
    display: flex;
    align-items: center;
}

.about-subtitle-wrap01 {
    margin: 0;
    padding: 0 10% 0 5%;
}

.about-subtitle01 {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    letter-spacing: 4px;
    line-height: 1.0;
    text-align: left;
    margin: 0 0 40px;
    padding: 0;
}
.about-subtitle01 br {
    display: none;
}

.about-subtitle-text01 {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2.0;
    text-align: left;
    margin: 0;
    padding: 0;
}

.about-photo01 {
    display: block;
    margin: 0;
    padding: 8px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.about-subtitle-wrapper02 {
    display: flex;
    flex-direction: row-reverse;
    margin: 0 0 6%;
    padding: 0 5%;
}

.about-subtitle-wrap02 {
    margin: 0;
    padding: 0 5% 0 10%;
}

.about-photo02 {
    display: block;
    margin: 0;
    padding: 8px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.about-subtitle-wrapper03 {
    margin: 0 0 6%;
    padding: 0 5%;
}

.about-subtitle-wrap03 {
    margin: 0;
    padding: 0 10% 0 5%;
}

.about-photo03 {
    display: block;
    margin: 0;
    padding: 8px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.group-title-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
}
.group-title-wrap {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2.0;
    text-align: left;
    margin: 0;
    padding: 0;
}
.group-title-wrap span {
    display: block;
    font-size: 1.4rem;
    line-height: 1.0;
    padding: 10px 0 0;
}
.group-img-wrap {
    display: block;
    margin: 5% 7%;
    padding: 10px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.group-img-wrap img {
    opacity: 1.0;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
.group-img-wrap img:hover {
    opacity: 0.5;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.group-img-wrap .group-subtitle {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.4;
    text-align: center;
    margin: 0;
    padding: 15px 10% 5px;
}
.group-titleimg-wrap {
    display: block;
    margin: 5% 7%;
    padding: 10px;
}

@media (max-width: 1680px){
    .about-subtitle01 {
        font-size: 1.7rem;
        margin: 0 0 30px;
    }
    .about-subtitle-text01 {
        font-size: 1.3rem;
    }
}
@media (max-width: 1480px){
    .about-photo01 {
        padding: 6px;
    }
    .about-photo02 {
        padding: 6px;
    }
    .about-photo03 {
        padding: 6px;
    }
    .about-first-text br.brbr {
        display: none;
    }
    .about-subtitle01 {
        font-size: 1.6rem;
        letter-spacing: 2px;
        margin: 0 0 20px;
    }
    .group-img-wrap {
        padding: 8px;
    }
}
@media (max-width: 1380px){
}
@media (max-width: 1200px){
    .about-first-title-wrapper {
        display: block;
        width: 100%;
        height: auto;
        padding-left: 10%;
        padding-right: 10%;
    }
    .about-first-text-wrap {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding-top: 0px;
        padding-bottom: 0px;
    }
    .second-first-text-wrap {
        padding-top: 0px;
        padding-bottom: 0px;
    }
    .about-first-text {
        text-align: center;
    }
    .about-subtitle-wrap01 {
        margin: 0 0 50px;
        padding: 0 5% 0 5%;
    }
    .about-subtitle01 {
        font-size: 1.8rem;
    }
    .about-subtitle-text01 {
        font-size: 1.4rem;
    }
    .about-subtitle-wrap02 {
        margin: 0 0 50px;
        padding: 0 5% 0 5%;
    }
    .about-subtitle-wrap03 {
        margin: 0 0 50px;
        padding: 0 5% 0 5%;
    }
    .group-img-wrap .group-subtitle {
        font-size: 1.3rem;
        padding: 15px 5% 5px;
    }
}
@media (max-width: 499px){
    .slider-about {
        margin-bottom: 50px;
    }
    .about-first-content-section {
        padding: 25px 25px 50px;
    }
    .about-content-first-section {
        padding: 50px 8% 50px;
    }
    .about-first-text-wrap {
        width: 100%;
    }
    .about-first-text {
        line-height: 2.0;
        letter-spacing: 1px;
        text-align: left;
    }
    .about-first-text br.br {
        display: none;
    }
    .about-second-title {
        margin: 0 0 40px;
    }
    .about-subtitle-wrapper01 {
        margin: 0 0 50px;
        padding: 0;
    }
    .about-subtitle-wrap01 {
        margin: 0 0 30px;
        padding: 0 15px;
    }
    .about-subtitle01 {
        font-size: 1.8rem;
        letter-spacing: 2px;
        line-height: 1.5;
        text-align: center;
        margin: 0 0 20px;
    }
    .about-subtitle01 br {
        display: block;
    }
    .about-subtitle-text01 br {
        display: none;
    }
    .about-subtitle-wrapper02 {
        margin: 0 0 50px;
        padding: 0;
    }
    .about-subtitle-wrap02 {
        margin: 0 0 30px;
        padding: 0 15px;
    }
    .about-subtitle-wrapper03 {
        margin: 0 0 50px;
        padding: 0;
    }
    .about-subtitle-wrap03 {
        margin: 0 0 30px;
        padding: 0 15px;
    }
    .about-photo01 {
        padding: 5px;
    }
    .about-photo02 {
        padding: 5px;
    }
    .about-photo03 {
        padding: 5px;
    }
    .group-img-wrap {
        margin: 5% 5%;
        padding: 6px;
    }
    .group-img-wrap .group-subtitle {
        font-size: 1.6rem;
    }
    .group-title-wrap {
        padding: 40px 5% 20px;
    }
    .group-titleimg-wrap {
        margin: 5% 7% 0;
    }
}



/* Btn Center
 * --------------------------------------- */

 .about-second-contact-title-wrap {
    display: block;
    padding: 10%;
    background-color: rgba(255, 255, 255, 0.85);
}

 .about-second-contact-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 0 2px;
}

 .about-group-linkbutton-wrap {
    display: block;
    width: 240px;
    height: 40px;
    margin: 40px auto 0;
    padding: 0;
}

.about-group-linkbutton-wrap-contact {
   display: block;
   margin: 40px 0 70px;
   padding: 0;
   text-align: center;
}

.linkbutton-group-center-btn {
    display: block;
    position: relative;
    width: 240px;
    height: 40px;
    text-align: left;
    margin: 0 auto;
    padding: 0 20px;
    background: transparent;
    line-height: 35px;
    border: solid 1px #111;
}

.linkbutton-group-center-btn::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    background-color: #111;
    -webkit-transform-origin: right top;
    -ms-transform-origin: right top;
    transform-origin: right top;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transition: -webkit-transform .3s;
    transition: -webkit-transform .3s;
    transition: transform .3s;
    transition: transform .3s, -webkit-transform .3s;
}

.linkbutton-group-center-btn:hover::before {
    -webkit-transform-origin: left top;
    -ms-transform-origin: left top;
    transform-origin: left top;
    -webkit-transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    transform: scale(1, 1);
}

.linkbutton-group-center-btn .text {
    display: inline-block;
    position: relative;
    font-size: 1.2rem;
    font-weight: 400;
    letter-spacing: 1px;
    color: #111;
    text-align: center;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-group-center-btn:hover {
    border: solid 1px #111;
}

.linkbutton-group-center-btn:hover .text {
    color: #FFF;
}

.linkbutton-group-center-btn .arrow {
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 8px;
    border-color: transparent transparent transparent #111;
    position: absolute;
    right: 15px;
    top: 47%;
    margin-top: -3px;
    transition: all .3s;
    -webkit-transition: all .3s;
    z-index: 2;
}

.linkbutton-group-center-btn:hover .arrow {
    border-color: transparent transparent transparent #FFF;
    right: 20px;
}

@media (max-width: 1200px) {
    .linkbutton-group-center-btn {
        margin: 0 auto;
    }
}
@media (max-width: 499px){
    .about-second-contact-title-wrap {
       padding: 40px 10%;
   }
}


/*------------------------------------------------------------------
[Interior Construction]
*/

.interior-first-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 8% 5% 8%;
    background-color: #FFF;
}

.interior-first-title-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-left: 20%;
    padding-right: 10%;
}

.interior-first-title {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 2px;
    text-align: left;
    color: #111;
    margin: 0;
    padding: 0 0 40px;
}

.interior-first-text {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.0;
    letter-spacing: 1px;
    text-align: left;
    color: #000;
    margin: 0 0 50px;
    padding: 0;
}

.interior-first-subtitle {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: left;
    margin: 0;
    padding: 0 0 15px;
    border-bottom: solid 1px #111;
}

dl.item-interior-first {
    width: 100%;
    padding: 15px 0;
    margin: 0;
}
dl.item-interior-first dt {
    float: left;
    width: 20px;
    font-size: 1.4rem;
    color: #111;
    text-align: left;
    line-height: 1.4;
    padding: 5px 0;
    margin: 0;
}
dl.item-interior-first dd {
    margin-left: 20px;
    font-size: 1.4rem;
    font-weight: 400;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    padding: 5px 0;
}


.interior-service-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 8% 2% 4%;
    background-color: #f4f2ec;
}
.interior-service-wrapper {
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 40px;
}
.interior-service-imgwrap {
    display: block;
    margin: 0 auto 20px;
    padding: 8px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

.interior-service-number {
    display: block;
    font-size: 1.8vw;
    font-weight: 500;
    font-style: italic;
    line-height: 1.4;
    letter-spacing: 0;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0;
}
.interior-service-subtitle {
    display: block;
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    text-align: left;
    margin: 0 0 10px;
    padding: 0;
}
.interior-service-subtext {
    display: block;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 1px;
    text-align: left;
    color: #111;
    margin: 0;
    padding: 0;
}
.interior-service-subtext a {
    display: block;
    color: #111;
    text-align: center;
    margin: 14px auto 0;
    padding: 0;
    line-height: 24px;
    border: solid 1px #111;
}
.interior-service-subtext a:hover {
    color: #FFF;
    background-color: #111;
}

@media (max-width: 1480px){
    .interior-service-subtitle br {
        display: none;
    }
    .interior-service-imgwrap {
        padding: 6px;
    }
}

@media (max-width: 499px){
    .interior-first-content-section {
        padding: 50px 8% 50px;
    }
    .interior-service-content-section {
        margin: 15px 15px;
        padding: 50px 2% 20px;
    }
    .interior-service-subtitle {
        font-size: 1.6rem;
    }
    .interior-service-subtitle br {
        display: block;
    }
    .about-group-linkbutton-wrap {
        margin: 30px auto 0;
    }
    .interior-service-wrapper {
        margin-left: 18px;
        margin-right: 18px;
        margin-bottom: 40px;
    }
    .interior-service-imgwrap {
        padding: 5px;
    }
    .interior-first-subtitle {
        text-align: center;
        padding: 0 0 15px 2px;
    }
}



/*!---------------------------------
[Interior Hyogo Kyoto Nara]
*/

.interior-first-text-wrapper-hyogo {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding-left: 4%;
}

.interior-first-title-hyogo {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 2px;
    text-align: left;
    color: #111;
    margin: 0;
    padding: 0 0 40px;
}

.interior-first-text-hyogo {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.5;
    letter-spacing: 1px;
    text-align: left;
    color: #000;
    margin: 0;
    padding: 0;
}

.interior-second-title-hyogo {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 30px;
    padding: 0 0 0 2px;
}

.interior-second-title-ja {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 50px 4px;
}
.interior-second-title-ja br {
    display: none;
}

.interior-projects-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px 15px;
    padding: 8% 2% 4%;
    background-color: #f4f2ec;
}

.interior-second-foottext {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 20px 0 50px 2px;
}

.interior-second-foottitle {
    display: block;
    font-size: 1.6rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0 0 20px;
    padding: 0;
}

dl.item-interior-second-foot {
    width: 440px;
    padding: 15px 0;
    margin: 0 auto;
}
dl.item-interior-second-foot dt {
    float: left;
    width: 20px;
    font-size: 1.4rem;
    color: #111;
    text-align: left;
    line-height: 1.4;
    padding: 5px 0;
    margin: 0;
}
dl.item-interior-second-foot dd {
    margin-left: 20px;
    font-size: 1.4rem;
    font-weight: 400;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    padding: 5px 0;
}

#interior-second-parallax-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 12% 25% 12%;
    background-image: url(../assets/img/interior-parallax-bg.jpg);
    background-size: cover;
    background-position: center top;
}

#interior-third-parallax-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 12% 25% 12%;
    background-image: url(../assets/img/interior-parallax-bg02.jpg);
    background-size: cover;
    background-position: center top;
}

.interior-service-content-section-w {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 8% 2% 4%;
    background-color: #FFF;
}

.interior-service-content-section-b {
    width: calc(100% - 30px);
    height: auto;
    margin: 15px 15px;
    padding: 8% 2% 4%;
    background-color: #f4f2ec;
}

.interior-process-content-section-w {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 10% 5%;
    background-color: #FFF;
}

.interior-qanda-content-section-b {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 10% 5%;
    background-color: #f4f2ec;
}

@media (max-width: 1480px){
    .interior-first-text-wrapper-hyogo {
        padding-left: 0;
    }
    .interior-first-text-hyogo br.br {
        display: none;
    }
}
@media (max-width: 1200px){
    .interior-first-text-wrapper-hyogo {
        display: block;
        width: 100%;
        height: auto;
    }
    .interior-first-title-hyogo {
        text-align: center;
    }
    .interior-first-text-hyogo {
        text-align: center;
        margin: 0 0 30px;
    }
}
@media (max-width: 990px){
}
@media (max-width: 749px){
}
@media (max-width: 499px){
    .interior-first-text-hyogo {
        text-align: left;
        line-height: 2.0;
        margin: 0 0 20px;
    }
    .interior-first-title-hyogo {
        text-align: center;
        padding: 30px 0 40px;
    }

    .interior-projects-content-section {
        padding: 50px 2% 30px;
    }
    .interior-second-title-hyogo {
        margin: 0 0 20px;
    }
    .interior-second-title-ja {
        line-height: 1.4;
        padding: 0 0 30px 4px;
    }
    .interior-second-title-ja br {
        display: block;
    }
    .interior-second-foottext {
        text-align: center;
        margin: 0 5%;
        padding: 0 0 40px;
    }
    .interior-second-foottitle {
        margin: 0;
        padding: 0;
    }
    dl.item-interior-second-foot {
        width: 90%;
    }

    .interior-service-content-section-w {
        padding: 50px 0 30px;
    }

    .interior-service-content-section-b {
        padding: 50px 0 30px;
    }

    .interior-process-content-section-w {
        padding: 50px 20px 30px;
    }

    .interior-qanda-content-section-b {
        padding: 50px 5% 30px;
    }

    section.footer-section.hyogo {
        padding: 50px 2% 50px;
    }
}


/*!---------------------------------
[Interior Parallax]
*/

#interior-service-parallax-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 12% 25% 12%;
    background-image: url(../assets/img/interior-parallax-bg.jpg);
    background-size: cover;
    background-position: center top;
}
.parallax-interior {
    background-attachment: fixed !important;
}

@media (max-width: 1200px) {
    #interior-service-parallax-section {
        padding: 30% 20% 30%;
    }

    .parallax-interior {
        background-attachment: local !important;
    }
}

@media (max-width: 990px) {
    #interior-service-parallax-section {
        padding: 40% 15% 40%;
    }
}

@media (max-width: 499px) {
    #interior-service-parallax-section {
        padding: 50% 10% 50%;
    }
}



/*!---------------------------------
[Interior Process]
*/

.interior-process-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 10% 5%;
    background-color: #f4f2ec;
}

.second-works-flow-section {
    position: relative;
    display: block;
    width: 100%;
    padding: 0 0 5%;
	margin: 0;
}

.f-right {
	flex-direction: row-reverse;
}

.features__item02 {
	text-align: left;
	background: linear-gradient(to right, #F5F5F5, #FFFFFF);
	padding: 0;
	border: solid 1px #111;
}

dl.item-flow02 {
    width: 100%;
	height: 50px;
    padding: 0;
    margin: 0;
}
dl.item-flow02 dt {
	display: flex;
	align-items: center;
    float: left;
    width: 50px;
	height: 50px;
    padding: 0;
    margin: 0;
}
dl.item-flow02 dd {
	display: flex;
    justify-content: center;
	align-items: center;
    margin-left: 50px;
    margin-right: 50px;
	height: 50px;
    padding: 0;
}
dl.item-flow02 dt .features__item__icon_step {
	display: block;
    width: 50px;
    height: 50px;
	font-size: 1.6rem;
	font-weight: 400;
    font-style: italic;
	color: #FFF;
	line-height: 1.0;
	letter-spacing: 0;
	margin: 0 auto;
	background-color: #111;
	text-align: center;
	padding: 10px;
}
dl.item-flow02 dt .features__item__icon_step_text {
	display: block;
	font-size: 1.0rem;
    font-style: italic;
	font-weight: 400;
	line-height: 1.0;
	letter-spacing: 0;
	color: #FFF;
	text-align: center;
	margin: 0 0 5px;
	padding: 0;
}
dl.item-flow02 dd .features__item__heading02 {
	display: block;
    font-size: 1.6rem;
    font-weight: 600;
	color: #111;
    letter-spacing: 2px;
	margin: 0;
	padding: 0;
}

.item-flow02-textwrap {
	display: flex;
	align-items: center;
	height: 50px;
	padding-left: 5%;
	padding-right: 5%;
}
.item-flow02-textwrap .features__item__body02l {
	width: 100%;
	font-size: 1.2rem;
    font-weight: 400;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: left;
	color: #111;
	margin: 0;
	padding: 0;
}
.item-flow02-textwrap .features__item__body02r {
	width: 100%;
	font-size: 1.2rem;
    font-weight: 400;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: left;
	color: #111;
	margin: 0;
	padding: 0;
}

.features__item__arrow01 {
    font-size: 3.0rem;
	color: #111;
	text-align: center;
	margin: 20px auto;
}
.features__item__arrow02 {
    font-size: 3.0rem;
	color: #111;
	text-align: center;
	margin: 20px auto;
}

@media (max-width: 1480px){
	.item-flow02-textwrap .features__item__body02l br {
		display: none;
	}
	.item-flow02-textwrap .features__item__body02r br {
		display: none;
	}
}
@media (max-width: 1200px){
	.item-flow02-textwrap {
		padding-left: 2%;
		padding-right: 2%;
	}
    dl.item-flow02 dd .features__item__heading02 {
        font-size: 1.5rem;
    }
	.features__item__arrow01 {
		margin: 20px auto;
	}
	.features__item__arrow02 {
		margin: 20px auto;
	}
}
@media (max-width: 990px){
	.item-flow02-textwrap {
		height: auto;
		padding-top: 20px;
		padding-bottom: 0;
		padding-left: 5%;
		padding-right: 5%;
	}
	.item-flow02-textwrap .features__item__body02r {
		text-align: left;
	}
	.features__item__arrow01 {
		margin: 10px auto;
	}
	.features__item__arrow02 {
		margin: 10px auto;
	}
}
@media (max-width: 499px){
	.item-flow02-textwrap {
		padding-top: 10px;
	}
	.features__item__arrow01 {
		margin: 0 auto 8px;
	}
	.features__item__arrow02 {
		margin: 0 auto 8px;
	}
    .item-flow02-textwrap .features__item__body02l {
        padding: 0 10px;
        line-height: 1.6;
    }
	.item-flow02-textwrap .features__item__body02r {
        padding: 0 10px;
        line-height: 1.6;
	}
}


/*!---------------------------------
[Interior Q&A]
*/

.interior-qanda-content-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 10% 0;
    background-color: #FFF;
}



table.tbl-r05 {
	width: 100%;
	border: 1px solid #111;
	border-collapse: collapse;
}
table.tbl-r05 td, 
table.tbl-r05 th {
	border: 1px solid #111;
	border-collapse: collapse;
}
table.tbl-r05 th {
	padding: 15px 20px;
	height: auto;
	font-size: 1.4rem;
    font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: center;
    vertical-align: middle;
	color: #111;
	background: #F0F0F0;
}
table.tbl-r05 td {
	padding: 15px 20px;
	height: auto;
	font-size: 1.2rem;
    font-weight: 400;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: left;
    vertical-align: middle;
	color: #111;
}
table.tbl-r05 th.head {
	padding: 15px 20px;
	width: 70%;
	height: auto;
	font-size: 1.4rem;
    font-weight: 600;
	letter-spacing: 1px;
	line-height: 1.5;
	text-align: center;
    vertical-align: middle;
	color: #111;
	background: #F0F0F0;
}
table.tbl-r05 th.heads {
	width: 20%;
}
table.tbl-r05 td.head {
	width: 30%;
	font-size: 1.3rem;
    font-weight: 600;
	letter-spacing: 0;
	line-height: 1.5;
	text-align: center;
    vertical-align: middle;
	color: #111;
	background: #F0F0F0;
}
table.tbl-r05 .even {
	background: #fbf8f0;
}
table.tbl-r05 .odd {
	background: #fefcf9;
}

table.tbl-r05 td:first-child {
    background: #fbf5f5;
}

@media screen and (max-width: 499px) {
    table.tbl-r05 {
        width: 100%;
        border: 0px solid #111;
        border-top: 1px solid #111;
        border-left: 1px solid #111;
        border-right: 1px solid #111;
    }
    table.tbl-r05 .thead {
        display: none;
    }
    table.tbl-r05 td, 
    table.tbl-r05 th {
        border: 0px solid #111;
        border-bottom: 1px solid #111;
    }
    table.tbl-r05 td, 
    table.tbl-r05 th {
        width: 100%;
    }
    table.tbl-r05 th.head {
        width: 100%;
    }
    table.tbl-r05 td.head {
        width: 100%;
    }
    table.tbl-r05 tr {
        width: 100%;
    }
    table.tbl-r05 td {
        display: block;
        text-align: left;
        width: 100%;
        padding: 15px 15px;
    }
    table.tbl-r05 td:first-child {
        background: #F0F0F0;
        color: #111;
        font-size: 1.5rem;
        font-weight: 600;
        text-align: center;
    }
    table.tbl-r05 td:before {
        content: attr(data-label);
        display: block;
        width: 100%;
        font-size: 1.4rem;
        font-weight: 600;
        text-align: center;
        padding-bottom: 0px;
    }
    table.tbl-r05 td.head:before {
        display: none;
    }
}



dl.item-interior-qa01 {
    width: 100%;
    padding: 15px 0 0;
    margin: 0;
}
dl.item-interior-qa01 dt {
    float: left;
    width: 80px;
	font-size: 1.2rem;
    color: #111;
    text-align: left;
    line-height: 1.4;
    padding: 5px 0;
    margin: 0;
}
dl.item-interior-qa01 dd {
    margin-left: 80px;
	font-size: 1.2rem;
    font-weight: 400;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    padding: 5px 0;
}

dl.item-interior-qa02 {
    width: 100%;
    padding: 15px 0 0;
    margin: 0;
}
dl.item-interior-qa02 dt {
    float: left;
    width: 20px;
	font-size: 1.2rem;
    color: #111;
    text-align: left;
    line-height: 1.4;
    padding: 5px 0;
    margin: 0;
}
dl.item-interior-qa02 dd {
    margin-left: 20px;
	font-size: 1.2rem;
    font-weight: 400;
    text-align: left;
    line-height: 1.4;
    letter-spacing: 1px;
    color: #111;
    padding: 5px 0;
}

@media (max-width: 1480px){
    .interior-first-title-wrapper {
        padding-left: 10%;
        padding-right: 20%;
    }
    .interior-first-text br.br {
        display: none;
    }
    .interior-process-content-section {
        padding: 8% 5% 5%;
    }
    .interior-qanda-content-section {
        padding: 8% 5% 0;
    }
}
@media (max-width: 1200px){
    .interior-first-title-wrapper {
        padding-left: 25%;
        padding-right: 25%;
        margin-bottom: 15%;
    }
}
@media (max-width: 990px){
    .interior-service-number {
        font-size: 3.0rem;
    }
}
@media (max-width: 499px){
    .interior-first-title-wrapper {
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 0;
    }
    .interior-first-title {
        text-align: center;
        padding: 40px 0 40px 2px;
    }
    .interior-process-content-section {
        padding: 50px 25px 40px;
    }
    dl.item-flow02 dd .features__item__heading02 {
        font-size: 1.4rem;
    }
    .interior-qanda-content-section {
        padding: 50px 15px 0;
    }
}



/*------------------------------------------------------------------
[Graphic]
*/

.graphic-first-title-en {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    letter-spacing: 2px;
    color: #111;
    text-align: left;
    margin: 0;
    padding: 0 0 40px;
}
.graphic-first-title-jp {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    text-align: left;
    color: #111;
    margin: 0;
    padding: 0 0 50px;
}

.graphic-first-text {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 2.5;
    letter-spacing: 1px;
    text-align: left;
    color: #000;
    margin: 0 0 40px;
    padding: 0;
}

.graphic-second-title-en {
    display: block;
    font-size: 2.0rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    letter-spacing: 2px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 30px 2px;
}

.graphic-second-title-jp {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: center;
    margin: 0;
    padding: 0 0 50px 4px;
}

.graphic-second-img-section {
    position: relative;
    width: calc(100% - 30px);
    height: auto;
    margin: 0 auto;
    padding: 8% 0 8%;
    background-color: #FFF;
}


/* Graphic Parallax */
#graphic-service-parallax-section {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 12% 25% 12%;
    background-image: url(../assets/img/graphic-parallax-bg.jpg);
    background-size: cover;
    background-position: center top;
}
.parallax-graphic {
    background-attachment: fixed !important;
}
#graphic-service-parallax-section .graphic-parallax-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.75);
}

@media (max-width: 1200px) {
    #graphic-service-parallax-section {
        padding: 30% 20% 30%;
    }

    .parallax-graphic {
        background-attachment: local !important;
    }
}

@media (max-width: 990px) {
    #graphic-service-parallax-section {
        padding: 40% 15% 40%;
    }
}

@media (max-width: 499px) {
    #graphic-service-parallax-section {
        padding: 50% 10% 50%;
    }
}


/* Graphic Img */
.graphic-img-wrap {
    display: block;
    margin: 0 4% 20px;
    padding: 8px;
    background-color: #FFF;
    box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow:rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}

@media (max-width: 1480px){
    .graphic-img-wrap {
        padding: 6px;
    }
    .graphic-first-text br.br {
        display: none;
    }
}
@media (max-width: 1380px){
}
@media (max-width: 1300px){
}
@media (max-width: 1200px){
    .graphic-first-title-en {
        text-align: center;
        padding: 0 0 20px 2px;
    }
    .graphic-first-title-jp {
        text-align: center;
        padding: 0 0 50px 4px;
    }
    .graphic-first-text span {
        display: block;
        text-align: center;
    }
    .graphic-first-text br.brbr {
        display: none;
    }
}
@media (max-width: 990px){
}
@media (max-width: 749px){
}
@media (max-width: 499px){
    .graphic-first-title-en {
        text-align: center;
        padding: 30px 0 30px 2px;
    }
    .graphic-first-text {
        line-height: 2.0;
    }
    .graphic-second-img-section {
        padding: 50px 0 50px;
    }
    .graphic-img-wrap {
        margin: 0 20px 20px;
        padding: 5px;
    }
}



/*------------------------------------------------------------------
[Cosmetics]
*/

.cosmetics-first-content-section {
    width: calc(100% - 30px);
    height: auto;
    margin: 0 15px;
    padding: 10% 20px 9%;
    background-color: #f4f2ec;
}

.cosmetics-first-title-en {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    letter-spacing: 2px;
    color: #111;
    text-align: left;
    margin: 0;
    padding: 0 0 30px;
}

.cosmetics-first-title-jp {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.0;
    letter-spacing: 4px;
    color: #111;
    text-align: left;
    margin: 0;
    padding: 0 0 30px;
}

.cosmetics-first-subtitle-en {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    letter-spacing: 2px;
    color: #111;
    text-align: left;
    margin: 0;
    padding: 0 0 40px;
}


.cosmetics-logolead-wrapper {
    display: flex;
    align-items: center;
    padding: 0 5% 6%;
}
.cosmetics-subtitle-wrap {
    margin: 0;
    padding: 0;
}
.cosmetics-logowrap {
    display: block;
    width: 200px;
    margin: 0 auto 40px;
    padding: 0;
}
.cosmetics-logo-lead {
    display: block;
    font-size: 1.8rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.8;
    text-align: center;
    margin: 0;
    padding: 0;
}

.cosmetics-imgtext-wrapper01 {
    display: flex;
    align-items: center;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 12%;
    padding: 0 5%;
}

.cosmetics-imgtext-wrapper02 {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0;
    padding: 0 5%;
}

.cosmetics-subtitle-wrap01 {
    padding: 0 0 0 15%;
}

.cosmetics-subtitle-wrap02 {
    padding: 0 15% 0 0;
}

.cosmetics-subtitle-text {
    display: block;
    font-size: 1.3rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 2.0;
    text-align: left;
    margin: 0 0 40px;
    padding: 0;
}
.cosmetics-subtitle-text br {
    display: none;
}

.cosmetics-photo-wrap {
    display: block;
    margin: 0;
    padding: 0;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}


.cosmetics-contact-img-wrap {
    display: block;
    margin: 5% 5%;
    padding: 50px 0;
    background-color: #FFF;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    text-align: center;
}
.cosmetics-contact-logowrap {
    display: block;
    width: 180px;
    margin: 0 auto 25px;
    padding: 0;
}
.cosmetics-contact-img-wrap .cosmetics-contact-subtitle {
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 1.4;
    text-align: center;
    margin: 0;
    padding: 0;
}
.cosmetics-contact-img-wrap .cosmetics-contact-subtitle br {
    display: none;
}

@media (max-width: 1480px){
    .cosmetics-imgtext-wrapper01 {
        margin-bottom: 10%;
    }
    .cosmetics-logowrap {
        width: 160px;
    }
    .cosmetics-logo-lead {
        font-size: 1.6rem;
        line-height: 1.6;
    }
    .cosmetics-subtitle-text {
        font-size: 1.2rem;
        line-height: 1.8;
        margin: 0 0 30px;
    }

    .cosmetics-contact-logowrap {
        width: 140px;
    }
    .cosmetics-subtitle-lead01 {
        font-size: 1.5rem;
    }
    .cosmetics-subtitle-text01 {
        font-size: 1.2rem;
    }
    .cosmetics-subtitle-lead02 {
        font-size: 1.5rem;
    }
    .cosmetics-subtitle-text02 {
        font-size: 1.2rem;
    }
    .cosmetics-contact-img-wrap .cosmetics-contact-subtitle {
        font-size: 1.2rem;
        line-height: 1.8;
    }
    .cosmetics-contact-img-wrap .cosmetics-contact-subtitle br {
        display: block;
    }
    .cosmetics-photo01 {
        padding: 6px;
    }
    .cosmetics-photo02 {
        padding: 6px;
    }
}
@media (max-width: 1200px){
    .cosmetics-first-title-en {
        text-align: center;
        padding: 0 0 20px 2px;
    }
    .cosmetics-first-title-jp {
        text-align: center;
        padding: 0 0 50px 4px;
    }
    .cosmetics-first-subtitle-en {
        text-align: center;
        padding: 0 0 40px 2px;
    }

    .cosmetics-imgtext-wrapper01 {
        margin-bottom: 15%;
    }
    .cosmetics-subtitle-wrap01 {
        margin: 0;
        padding: 5% 5% 0;
    }
    .cosmetics-subtitle-wrap02 {
        margin: 0;
        padding: 5% 5% 0;
    }
}
@media (max-width: 499px){
    .cosmetics-first-content-section {
        padding: 55px 25px 50px;
    }
    .cosmetics-first-subtitle-en {
        padding: 40px 0 30px 2px;
    }
    .cosmetics-subtitle-wrapper01 {
        display: block;
        padding: 0;
    }
    .cosmetics-subtitle-wrapper02 {
        display: block;
        padding: 0;
    }

    .cosmetics-logolead-wrapper {
        display: block;
        padding: 0;
    }
    .cosmetics-logowrap {
        width: 140px;
        margin: 0 auto 20px;
    }
    .cosmetics-logo-lead {
        margin: 0 auto 30px;
    }
    .cosmetics-imgtext-wrapper01 {
        display: block;
        padding: 0;
        margin-bottom: 70px;
    }
    .cosmetics-imgtext-wrapper02 {
        display: block;
        padding: 0;
    }
    .cosmetics-photo-wrap {
        margin: 0 auto 20px;
    }
    .cosmetics-subtitle-wrap01 {
        margin: 0;
        padding: 0 8px;
    }
    .cosmetics-subtitle-wrap02 {
        margin: 0;
        padding: 0 8px;
    }
    .cosmetics-subtitle-text br {
        display: block;
    }
}


/*------------------------------------------------------------------
[Company]
*/

#about {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 70px;
    padding-bottom: 100px;
    position: relative;
}

#about .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 50px;
}

#about .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#about p {
    font-size: 1.4rem;
    line-height: 200%;
}

#about .about01 {
    position: absolute;
    top: 257px;
    right: 178px;
}

#about .about02 {
    position: absolute;
    left: 190px;
    bottom: 85px;
}



#idea {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 60px;
    padding-bottom: 170px;
    position: relative;
}

#idea .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 45px;
}

#idea .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#idea .txt {
    font-size: 1.8rem;
    line-height: 150%;
    font-weight: bold;
    padding-bottom: 20px;
}

#idea p {
    font-size: 1.4rem;
    line-height: 200%;
}

#idea .idea01 {
    position: absolute;
    left: 320px;
    bottom: 70px;
}



#mission {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 0px;
    padding-bottom: 217px;
    position: relative;
}

#mission .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 40px;
}

#mission .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#mission .txt {
    font-size: 18px;
    line-height: 150%;
    font-weight: bold;
    padding-bottom: 20px;
}

#mission .mission01 {
    position: absolute;
    bottom: 100px;
    margin: auto;
    left: 0px;
    right: 0px;
}


#vision {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 0px;
    padding-bottom: 80px;
    position: relative;
}

#vision .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 40px;
}

#vision .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#vision .txt {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
    font-size: 18px;
    line-height: 150%;
    font-weight: bold;
    padding-bottom: 20px;
    text-align: center;
}
#vision .txt br.br {
    display: none;
}



#outline {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 40px;
    padding-bottom: 50px;
    position: relative;
}

#outline .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 25px;
}

#outline .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#outline .box {
    width: 100%;
    background-color: #F5F5F5;
    padding-top: 50px;
    padding-bottom: 35px;
}

#outline .box .line {
    width: 856px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 18px;
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #000;
}

#outline .box .tb {
    width: 856px;
    margin-right: auto;
    margin-left: auto;
}

#outline .box .tb th,
#outline .box .tb td {
    font-size: 1.4rem;
    line-height: 150%;
    padding-top: 20px;
    padding-bottom: 15px;
}

#outline .box .tb th {
    text-align: right;
    width: 27%;
    padding-right: 5%;
    color: #231F20;
}

#outline .box .tb td {
    text-align: left;
    width: 73%;
    padding-left: 5%;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #231F20;
}

#outline .box .tb td span {
    font-size: 1.4rem;
}

#outline .box .tb td iframe {
    width: 100%;
    height: 400px;
    margin-top: 20px;
}

#outline .box .tb td .link {
    font-size: 1.4rem;
    padding-top: 5px;
}

#outline .box .tb td .link a {
    color: #2AAAE2;
}

#outline .box .tb td .link a:hover {
    color: #1992BC;
}

#outline .box .tb td .link a img {
    vertical-align: middle;
    margin-right: 5px;
}



#history {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 60px;
    padding-bottom: 70px;
    position: relative;
}

#history .title {
    width: 250px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 25px;
}

#history .title p {
    font-size: 1.4rem;
    font-weight: normal;
    letter-spacing: 2px;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 2px;
}

#history .tb2 {
    width: 856px;
    margin-right: auto;
    margin-left: auto;
}

#history .tb2 th,
#history .tb2 td {
    font-size: 1.4rem;
    line-height: 150%;
    padding-top: 20px;
    padding-bottom: 25px;
}

#history .tb2 th {
    text-align: right;
    width: 27%;
    padding-right: 5%;
    color: #231F20;
    position: relative;
}

#history .tb2 th div {
    height: 12px;
    width: 12px;
    position: absolute;
    top: 27px;
    right: -8px;
    background-image: url(../images/circle.png);
    background-repeat: no-repeat;
}

#history .tb2 td {
    text-align: left;
    width: 73%;
    padding-left: 5%;
    border-left-width: 1px;
    border-left-style: solid;
    border-left-color: #111;
}

#history .tb2 td span {
    font-size: 1.4rem;
}

#history .tb2 td span.tm {
    font-size: 60%;
    vertical-align: top;
    position: relative;
    top: -0.5em;
}

#history .bt_area {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 105px;
}

#history .bt_area .bt {
    position: relative;
    -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
}

#history .bt_area .bt.bt_l {
    float: left;
    width: 46%;
    margin-left: 2%;
    margin-right: 2%;
    ;
}

#history .bt_area .bt.bt_r {
    float: right;
    width: 46%;
    margin-left: 2%;
    margin-right: 2%;
}

#history .bt_area .bt.bt_l a {
    width: 100%;
    font-size: 1.4rem;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #FFF;
    display: block;
    border: 1px solid #231F20;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    color: #000;
}

#history .bt_area .bt.bt_l a.arrow {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
}

#history .bt_area .bt.bt_l a.arrow::before,
#history .bt_area .bt.bt_l a.arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

#history .bt_area .bt.bt_l a.arrow::before {
    right: 14px;
    width: 15px;
    height: 1px;
    background: #000;
}

#history .bt_area .bt.bt_l a.arrow::after {
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#history .bt_area .bt.bt_l a:hover {
    color: #FFF;
    background-color: #231F20;
    border: 1px solid #231F20;
}

#history .bt_area .bt.bt_l a:hover::before {
    background: #FFF;
}

#history .bt_area .bt.bt_l a.arrow:hover::after {
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}

#history .bt_area .bt.bt_r a {
    width: 100%;
    font-size: 1.4rem;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #FFF;
    display: block;
    border: 1px solid #231F20;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

#history .bt_area .bt.bt_r a.arrow {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
}

#history .bt_area .bt.bt_r a.arrow::before,
#history .bt_area .bt.bt_r a.arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

#history .bt_area .bt.bt_r a.arrow::before {
    right: 14px;
    width: 15px;
    height: 1px;
    background: #231F20;
}

#history .bt_area .bt.bt_r a.arrow::after {
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #231F20;
    border-right: 1px solid #231F20;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#history .bt_area .bt.bt_r a:hover {
    color: #FFF;
    background-color: #231F20;
}

#history .bt_area .bt.bt_r a:hover::before {
    background: #FFF;
}

#history .bt_area .bt.bt_r a.arrow:hover::after {
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}


@media (max-width: 1380px){
    #about {
        width: 100%;
    }
    #outline {
        width: 100%;
    }
    #outline .box .tb {
        width: 90%;
    }
    #history {
        width: 100%;
    }
    #history .tb2 {
        width: 90%;
    }
    #history .bt_area {
        width: 90%;
    }
    #history .bt_area .bt.bt_l a.arrow {
        font-size: 1.5rem;
    }
    #history .bt_area .bt.bt_r a.arrow {
        font-size: 1.5rem;
    }
}

/* SP */
@media screen and (max-width: 1200px) {

    #about {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 2em;
        padding-bottom: 6em;
        position: relative;
    }

    #about .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #about .title img {
        width: 100%;
    }

    #about .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #about p {
        font-size: 90%;
        line-height: 200%;
    }

    #about .about01 {
        position: absolute;
        top: 3em;
        right: 0px;
    }

    #about .about02 {
        position: absolute;
        left: 0px;
        bottom: 1em;
    }

    #idea {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 6em;
        position: relative;
    }

    #idea .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #idea .title img {
        width: 100%;
    }

    #idea .title p {
        width: 100%;
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #idea .txt {
        font-size: 120%;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 2em;
    }

    #idea p {
        font-size: 90%;
        line-height: 200%;
    }

    #idea .idea01 {
        width: 50%;
        position: relative;
        left: auto;
        bottom: auto;
        margin-top: 0;
        margin-bottom: 0;
        margin-right: auto;
        margin-left: auto;
    }

    #mission {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 10em;
        position: relative;
    }

    #mission .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #mission .title img {
        width: 100%;
    }

    #mission .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #mission .txt {
        font-size: 120%;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 2em;
    }

    #mission .mission01 {
        position: absolute;
        bottom: 4em;
        margin: auto;
        left: 0px;
        right: 0px;
    }

    #vision {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 4em;
        position: relative;
    }

    #vision .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #vision .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #vision .txt {
        width: 100%;
        font-size: 120%;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 20px;
        text-align: center;
    }

    #outline {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 6em;
        position: relative;
    }

    #outline .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #outline .title img {
        width: 100%;
    }

    #outline .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #outline .box {
        width: 100%;
        background-color: #F3F1EF;
        padding-top: 2em;
        padding-bottom: 2em;
    }

    #outline .box .line {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 0px;
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: #000;
    }

    #outline .box .tb {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
    }

    #outline .box .tb th,
    #outline .box .tb td {
        font-size: 100%;
        line-height: 150%;
        padding-top: auto;
        padding-bottom: auto;
        display: block;
    }

    #outline .box .tb th {
        font-size: 120%;
        text-align: left;
        width: 100%;
        padding-right: 0%;
        color: #231F20;
        padding-top: 1em;
        padding-bottom: 0px;
    }

    #outline .box .tb td {
        text-align: left;
        width: 100%;
        padding-left: 0%;
        border-left-style: none;
        padding-bottom: 1em;
        padding-top: 0.5em;
        border-bottom-width: 1px;
        border-bottom-style: solid;
        border-bottom-color: #231F20;
    }

    #outline .box .tb td span {
        font-size: 90%;
    }

    #outline .box .tb td iframe {
        height: 318px;
        width: 100%;
        margin-top: 1em;
    }

    #outline .box .tb td .link {
        font-size: 100%;
        padding-top: 0.5em;
    }

    #outline .box .tb td .link a {
        color: #2AAAE2;
    }

    #outline .box .tb td .link a:hover {
        color: #1992BC;
    }

    #outline .box .tb td .link a img {
        vertical-align: middle;
        margin-right: 5px;
    }

    #history {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 0px;
        padding-bottom: 3em;
        position: relative;
    }

    #history .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #history .title img {
        width: 100%;
    }

    #history .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #history .tb2 {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }

    #history .tb2 th,
    #history .tb2 td {
        font-size: 100%;
        line-height: 150%;
        padding-top: 1em;
        padding-bottom: 1em;
    }

    #history .tb2 th {
        text-align: right;
        width: 19%;
        padding-right: 5%;
        color: #231F20;
        position: relative;
    }

    #history .tb2 th div {
        height: 12px;
        width: 12px;
        position: absolute;
        top: 1.3em;
        right: -8px;
        background-image: url(../images/circle.png);
        background-repeat: no-repeat;
    }

    #history .tb2 td {
        text-align: left;
        width: 69%;
        padding-left: 5%;
        border-left-width: 3px;
        border-left-style: solid;
        border-left-color: #E5E5E5;
    }

    #history .tb2 td span {
        font-size: 90%;
    }

    #history .tb2 td span.tm {
        font-size: 50%;
        vertical-align: top;
        position: relative;
        top: -0.5em;
    }

    #history .bt_area {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 4em;
    }

    #history .bt_area .bt {
        margin-right: auto;
        margin-left: auto;
        position: relative;
        -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
        filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
    }

    #history .bt_area .bt.bt_l {
        float: none;
        margin-bottom: 1em;
    }
    #history .bt_area .bt.bt_l {
        float: none;
        width: 90%;
        margin-bottom: 1em;
        margin-left: auto;
        margin-right: auto;
    }

    #history .bt_area .bt.bt_r {
        float: none;
        width: 90%;
        margin-bottom: 1em;
        margin-left: auto;
        margin-right: auto;
    }

    #history .bt_area .bt.bt_l a {
        width: 100%;
        font-size: 14px;
        padding-top: 20px;
        padding-bottom: 20px;
        display: block;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    #history .bt_area .bt.bt_l a.arrow {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        text-decoration: none;
        font-size: 15px;
    }

    #history .bt_area .bt.bt_l a.arrow::before,
    #history .bt_area .bt.bt_l a.arrow::after {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        content: "";
        vertical-align: middle;
    }

    #history .bt_area .bt.bt_l a.arrow::before {
        right: 14px;
        width: 15px;
        height: 1px;
    }

    #history .bt_area .bt.bt_l a.arrow::after {
        right: 16px;
        width: 6px;
        height: 6px;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #history .bt_area .bt.bt_r a {
        width: 100%;
        font-size: 14px;
        padding-top: 20px;
        padding-bottom: 20px;
        background-color: #FFF;
        display: block;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    #history .bt_area .bt.bt_r a.arrow {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        text-decoration: none;
        font-size: 15px;
    }

    #history .bt_area .bt.bt_r a.arrow::before,
    #history .bt_area .bt.bt_r a.arrow::after {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        content: "";
        vertical-align: middle;
    }

    #history .bt_area .bt.bt_r a.arrow::before {
        right: 14px;
        width: 15px;
        height: 1px;
        background: #231F20;
    }

    #history .bt_area .bt.bt_r a.arrow::after {
        right: 16px;
        width: 6px;
        height: 6px;
        border-top: 1px solid #231F20;
        border-right: 1px solid #231F20;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #history .bt_area .bt.bt_r a:hover {
        color: #FFF;
        background-color: #231F20;
    }

    #history .bt_area .bt.bt_r a:hover::before {
        background: #FFF;
    }

    #history .bt_area .bt.bt_r a.arrow:hover::after {
        border-top: 1px solid #FFF;
        border-right: 1px solid #FFF;
    }
}


@media (max-width: 499px){
    #about .title {
        width: 200px;
    }
    #idea .title {
        width: 200px;
    }
    #mission .title {
        width: 200px;
    }
    #vision .title {
        width: 200px;
    }
    #vision .txt br.br {
        display: block;
    }
    
    #outline .title {
        width: 200px;
    }
    #history .title {
        width: 200px;
    }
    #about {
        width: 88%;
        padding-top: 50px;
        padding-bottom: 70px;
    }
    #about p {
        font-size: 90%;
        line-height: 200%;
        text-align: center;
        margin-top: 20px;
    }
    #about p br.br {
        display: none;
    }
    #idea {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    #idea .idea01 {
        width: 100%;
        margin-top: 20px;
    }
    #about .about02 {
        bottom: 0;
    }
    #vision {
        padding-bottom: 0;
    }
    #outline {
        padding-top: 60px;
        padding-bottom: 0;
    }
    #outline .box .tb th {
        padding-top: 2em;
    }
    #outline .box .tb td {
        padding-bottom: 2em;
    }
    #history {
        padding-top: 60px;
    }
}


/*------------------------------------------------------------------
[Banner Area]
*/

#banner-area {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 30px);
    margin-right: 15px;
    margin-left: 15px;
    padding-top: 40px;
    padding-bottom: 40px;
}

.banner-area-img-wrapper {
    display: none;
}

.banner-area-img-wrap {
    display: block;
    margin: 5% 5%;
    padding: 8px;
    background-color: #FFF;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}
.banner-area-img-wrap img {
    opacity: 1.0;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
.banner-area-img-wrap img:hover {
    opacity: 0.5;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    -ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

@media (max-width: 1480px){
    .banner-area-img-wrap {
        padding: 6px;
    }
}

@media (max-width: 499px){
    #banner-area {
        width: 100%;
        margin-right: 0px;
        margin-left: 0px;
    }
    .banner-area-img-wrapper {
        display: block;
    }
    .banner-area-img-wrap {
        margin: 6px 6px;
        padding: 5px;
    }
}


/*------------------------------------------------------------------
[Partner]
*/

#partner {
    width: 950px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 50px;
    padding-bottom: 0px;
    position: relative;
}

#partner .title {
    width: 226px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 45px;
}

#partner .title p {
    width: 100%;
    font-size: 18px;
    font-weight: normal;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

#partner .txt {
    font-size: 22px;
    line-height: 150%;
    font-weight: bold;
    padding-bottom: 20px;
}

#partner p {
    font-size: 16px;
    line-height: 200%;
}

#partner .inquiry {
    width: 656px;
    margin-right: auto;
    margin-left: auto;
    background-color: #FFF;
    margin-top: 80px;
    position: relative;
    padding-top: 28px;
    padding-bottom: 20px;
    border: 1px solid #231F20;
    margin-bottom: 110px;
}

#partner .inquiry .txt {
    font-size: 18px;
    padding-bottom: 22px;
}

#partner .inquiry .tel {
    width: 411px;
    margin-right: auto;
    margin-left: auto;
}

#partner .inquiry .tel img {
    width: 100%;
    height: auto;
}

#partner .inquiry .cap {
    font-size: 12px;
    padding-top: 20px;
}

#partner .inquiry .slash1 {
    position: absolute;
    left: -14px;
    top: -14px;
}

#partner .inquiry .slash2 {
    position: absolute;
    right: -14px;
    bottom: -14px;
}
#tenant{
 margin-top: -40px;
 padding-top: 40px;
}
#partner .tb{
 margin: 40px auto 0;
 width: 100%;
 border-top: 1px solid #adadad;
 border-left: 1px solid #adadad;
 font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#partner .tb th,
#partner .tb td{
 padding: 30px;
 border-right: 1px solid #adadad;
 border-bottom: 1px solid #adadad;
}
#partner .tb th{
 background-color: #ececec;
 font-size: 15px;
 font-weight: 600;
 line-height: 140%;
 text-align: center;
 width: 200px;
}
#partner .tb td{
 font-size: 15px;
 font-weight: 300;
 line-height: 140%;
 text-align: left;
}


/* SP */
@media screen and (max-width: 1200px) {

    #partner {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 2em;
        padding-bottom: 0em;
        position: relative;
    }

    #partner .title {
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #partner .title img {
        width: 100%;
    }

    #partner .title p {
        width: 100%;
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #partner .txt {
        font-size: 120%;
        line-height: 150%;
        font-weight: bold;
        padding-bottom: 2em;
    }

    #partner p {
        font-size: 90%;
        line-height: 200%;
    }

    #partner .inquiry {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        background-color: #FFF;
        margin-top: 3em;
        position: relative;
        padding-top: 28px;
        padding-bottom: 20px;
        border: 1px solid #231F20;
        margin-bottom: 110px;
    }

    #partner .inquiry .txt {
        font-size: 120%;
        padding-bottom: 1em;
    }

    #partner .inquiry .tel {
        width: 85%;
        margin-right: auto;
        margin-left: auto;
        height: auto;
    }

    #partner .inquiry .tel img {
        width: 100%;
    }

    #partner .inquiry .cap {
        font-size: 100%;
        padding-top: 1em;
    }

    #partner .inquiry .slash1 {
        position: absolute;
        left: -14px;
        top: -14px;
    }

    #partner .inquiry .slash2 {
        position: absolute;
        right: -14px;
        bottom: -14px;
    }
#tenant{
 margin-top: -40px;
 padding-top: 40px;
}
#partner .tb{
 margin: 40px auto 0;
 width: 100%;
 border-top: 1px solid #adadad;
 border-left: 1px solid #adadad;
 font-family: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#partner .tb th,
#partner .tb td{
 padding: 4vw;
 border-right: 1px solid #adadad;
 border-bottom: 1px solid #adadad;
}
#partner .tb th{
 background-color: #ececec;
        font-size: 85%;
 font-weight: 600;
 line-height: 140%;
 text-align: center;
 width: 30%;
}
#partner .tb td{
        font-size: 85%;
 font-weight: 300;
 line-height: 140%;
 text-align: left;
}
}

@media (max-width: 499px){

    #partner .title {
        width: 200px;
    }
    #partner .inquiry {
        margin-bottom: 30px;
    }
}


/*------------------------------------------------------------------
[FAQ Page]
*/

/* PC */

.spOnly {
    display: none;
}

#faq{
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #FFF;
}

#faq .title {
    width: 274px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 20px;
}

#faq .title p {
    width: 100%;
    font-size: 18px;
    font-weight: normal;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

#faq .txt {
    padding: 0;
    width: 100%;
    font-size: 16px;
    line-height: 150%;
    text-align: center;
}

#faq .cover {
    margin: 0 auto;
    padding: 30px 0 0;
    width: 940px;
    counter-reset: number 0;
}

#faq .cover .subT {
    margin: 40px 0 0;
    width: 100%;
}

#faq .cover .subT div {
    float: left;
    padding: 0 5px 0 0;
    width: auto;
    font-size: 1.8rem;
    line-height: 100%;
    text-align: left;
    font-weight: bold;
    color: #000;
    display: block;
}

#faq .cover .subT span {
    float: right;
    margin: 5px 0 0;
    width: 700px;
    height: 3px;
    background-color: #000;
    display: inline-block;
}

#faq .cover .subT.t2 span {
    width: 700px;
}

#faq .cover .subT.t3 span {
    width: 700px;
}

#faq .cover .subT.t4 span {
    width: 700px;
}

#faq .cover .qBox {
    width: 100%;
    text-align: left;
    border-bottom: 1px dotted #000;
}

#faq .cover .qBox .q {
    padding: 30px 0 20px;
    position: relative;
    display: block;
    cursor: pointer;
}

#faq .cover .qBox .q .no {
    float: left;
    margin: 0 25px 0 0;
    padding: 5px 0;
    width: 100px;
    font-size: 1.6rem;
    line-height: 100%;
    text-align: center;
    color: #fff;
    font-weight: bold;
    background-color: #000;
    border-radius: 5px;
    display: block;
}

#faq .cover .qBox .q .no:before {
    counter-increment: number 1;
    /* number カウンタの増加数をセット */
    content: "Q." counter(number, decimal-leading-zero);
    /* 表示形式を指定 */
}

#faq .cover .qBox .q p {
    margin: 0 0 0 120px;
    padding: 0;
    width: calc(100% - 180px);
    font-size: 1.4rem;
    line-height: 150%;
    display: block;
}

#faq .cover .qBox .q .accordion_icon,
#faq .cover .qBox .q .accordion_icon span {
    display: inline-block;
    transition: all .3s;
    box-sizing: border-box;
}

#faq .cover .qBox .q .accordion_icon {
    position: absolute;
    width: 30px;
    height: 30px;
    top: 40px;
    right: 10px;
}

#faq .cover .qBox .q .accordion_icon span {
    position: absolute;
    width: 100%;
    height: 3px;
    background-color: #000;
}

#faq .cover .qBox .q .accordion_icon span:nth-of-type(1) {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}

#faq .cover .qBox .q .accordion_icon span:nth-of-type(2) {
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}

#faq .cover .qBox .q .accordion_icon.active span:nth-of-type(1) {
    display: none;
}

#faq .cover .qBox .q .accordion_icon.active span:nth-of-type(2) {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}

#faq .cover .qBox .a {
    display: none;
    padding: 0 0 20px;
}

#faq .cover .qBox .a .pCover {
    margin: 0;
    padding: 20px 40px;
    background-color: #f4f2ec;
}

#faq .cover .qBox .a .pCover p {
    margin: 0;
    padding: 0;
    font-size: 1.4rem;
    line-height: 150%;
}

#faq .cover .qBox .a .pCover p a {
    transition: 0.3s;
}

#faq .cover .qBox .a .pCover p a:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

#faq .cover .qBox .a .pCover .arrow a {
    float: right;
    margin: 10px 0 0 0;
    padding: 10px 30px 10px 20px;
    width: auto;
    font-size: 16px;
    line-height: 100%;
    text-align: center;
    color: #111;
    font-weight: bold;
    background-position: right center;
    background-size: auto 100%;
    background-repeat: no-repeat;
    border-radius: 5px;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    transition: 0.3s;
}

#faq .cover .qBox .a .pCover .arrow a:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

#faq .cover .qBox .a img {
    width: 100%;
    height: auto;
}

#faq .cover .qBox .a img.faq01sp {
    display: none;
}

#faq .cover .mystaBt {
    display: none;
}

#faq .cover .mystaBt {
    margin: 20px 0 40px auto;
    width: 340px;
    text-align: center;
    display: block;
}

#faq .cover .mystaBt a {
    padding: 15px 10px;
    font-size: 1.3rem;
    line-height: 100%;
    font-weight: bold;
    color: #fff;
    display: block;
    background-color: #dc5d68;
    transition: .3s;
}

#faq .cover .mystaBt a:hover {
    opacity: 0.5;
}


#faq .bt {
    margin-right: auto;
    margin-left: auto;
    margin-top: 40px;
    position: relative;
    -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
}

#faq .bt a {
    width: 290px;
    font-size: 1.4rem;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #FFF;
    display: block;
    border: 1px solid #231F20;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

#faq .bt a.arrow {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
    font-size: 18px;
}

#faq .bt a.arrow::before,
#faq .bt a.arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

#faq .bt a.arrow::before {
    right: 14px;
    width: 15px;
    height: 1px;
    background: #231F20;
}

#faq .bt a.arrow::after {
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #231F20;
    border-right: 1px solid #231F20;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#faq .bt a:hover {
    color: #FFF;
    background-color: #231F20;
}

#faq .bt a:hover::before {
    background: #FFF;
}

#faq .bt a.arrow:hover::after {
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}


@media (max-width: 1380px) {
    #faq .cover {
        width: 90%;
    }

    #faq .cover .subT span {
        width: 600px;
    }

    #faq .cover .subT.t2 span {
        width: 600px;
    }

    #faq .cover .subT.t3 span {
        width: 600px;
    }

    #faq .cover .subT.t4 span {
        width: 600px;
    }
}

@media (max-width: 1280px) {
    #faq .cover .subT span {
        width: 500px;
    }

    #faq .cover .subT.t2 span {
        width: 500px;
    }

    #faq .cover .subT.t3 span {
        width: 500px;
    }

    #faq .cover .subT.t4 span {
        width: 500px;
    }
}


/* SP */
@media screen and (max-width: 1200px) {

    #faq {
        padding: 2em 0;
        width: 100%;
    }

    #faq .title {
        width: 250px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 1em;
    }

    #faq .title img {
        width: 100%;
    }

    #faq .title p {
        width: 100%;
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #faq .txt {
        padding: 0;
        width: 100%;
        font-size: 110%;
        line-height: 150%;
        text-align: center;
    }

    #faq .cover {
        margin: 0 auto;
        padding: 1em 0 0;
        width: 90%;
        counter-reset: number 0;
    }

    #faq .cover .subT {
        margin: 2em 0 0;
        width: 100%;
    }

    #faq .cover .subT div {
        float: left;
        padding: 0 5px 0 0;
        width: auto;
        font-size: 1.8rem;
        line-height: 100%;
        text-align: left;
        font-weight: bold;
        color: #000;
        display: block;
    }

    #faq .cover .subT span {
        float: right;
        margin: 0.8em 0 0;
        width: 60%;
        height: 3px;
        background-color: #000;
        display: inline-block;
    }

    #faq .cover .subT.t2 span {
        width: 60%;
    }

    #faq .cover .subT.t3 span {
        width: 60%;
    }

    #faq .cover .subT.t4 span {
        width: 60%;
    }

    #faq .cover .qBox {
        width: 100%;
        text-align: left;
        border-bottom: 1px dotted #000;
    }

    #faq .cover .qBox .q {
        padding: 1em 0;
        position: relative;
        display: block;
        cursor: pointer;
    }

    #faq .cover .qBox .q .no {
        float: none;
        margin: 0 0 10px;
        padding: 5px 0;
        width: 70px;
        font-size: 100%;
        line-height: 100%;
        text-align: center;
        color: #fff;
        font-weight: bold;
        background-color: #000;
        border-radius: 5px;
        display: block;
    }

    #faq .cover .qBox .q .no:before {
        counter-increment: number 1;
        /* number カウンタの増加数をセット */
        content: "Q." counter(number, decimal-leading-zero);
        /* 表示形式を指定 */
    }

    #faq .cover .qBox .q p {
        margin: 0;
        padding: 0;
        width: calc(100% - 45px);
        font-size: 100%;
        line-height: 150%;
        display: block;
    }

    #faq .cover .qBox .q .accordion_icon,
    #faq .cover .qBox .q .accordion_icon span {
        display: inline-block;
        transition: all .3s;
        box-sizing: border-box;
    }

    #faq .cover .qBox .q .accordion_icon {
        position: absolute;
        width: 30px;
        height: 30px;
        top: 40px;
        right: 5px;
    }

    #faq .cover .qBox .q .accordion_icon span {
        position: absolute;
        width: 100%;
        height: 3px;
        background-color: #000;
    }

    #faq .cover .qBox .q .accordion_icon span:nth-of-type(1) {
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
    }

    #faq .cover .qBox .q .accordion_icon span:nth-of-type(2) {
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
    }

    #faq .cover .qBox .q .accordion_icon.active span:nth-of-type(1) {
        display: none;
    }

    #faq .cover .qBox .q .accordion_icon.active span:nth-of-type(2) {
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
    }

    #faq .cover .qBox .a {
        display: none;
        padding: 0 0 1.5em;
    }

    #faq .cover .qBox .a .pCover {
        margin: 0;
        padding: 1em 5%;
        background-color: #f4f2ec;
    }

    #faq .cover .qBox .a .pCover p {
        margin: 0;
        padding: 0;
        font-size: 100%;
        line-height: 150%;
    }

    #faq .cover .qBox .a .pCover .arrow a {
        float: right;
        margin: 10px 0 0 0;
        padding: 10px 30px 10px 20px;
        width: auto;
        font-size: 100%;
        line-height: 1.4;
        text-align: center;
        color: #111;
        font-weight: bold;
        background-position: right center;
        background-size: auto 100%;
        background-repeat: no-repeat;
        border-radius: 5px;
        display: block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        transition: 0.3s;
    }

    #faq .cover .qBox .a img {
        width: 100%;
        height: auto;
    }

    #faq .cover .qBox .a img.faq01pc {
        display: none;
    }

    #faq .cover .qBox .a img.faq01sp {
        display: block;
    }

    #faq .cover .mystaBt {
        margin: 1.5em auto 3em;
        width: 100%;
        text-align: center;
        display: block;
    }

    #faq .cover .mystaBt a {
        padding: 15px 20px;
        font-size: 1.6rem;
        line-height: 100%;
        font-weight: bold;
        color: #fff;
        display: block;
        background-color: #dc5d68;
        transition: .3s;
    }

    #faq .cover .mystaBt a:hover {
        opacity: 0.5;
    }


    #faq .bt {
        margin-right: auto;
        margin-left: auto;
        margin-top: 2em;
        position: relative;
        -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
        filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
    }

    #faq .bt a {
        width: 90%;
        font-size: 120%;
        padding-top: 20px;
        padding-bottom: 20px;
        background-color: #FFF;
        display: block;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    #faq .bt a.arrow {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        text-decoration: none;
        font-size: 18px;
    }

    #faq .bt a.arrow::before,
    #faq .bt a.arrow::after {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        content: "";
        vertical-align: middle;
    }

    #faq .bt a.arrow::before {
        right: 14px;
        width: 15px;
        height: 1px;
        background: #231F20;
    }

    #faq .bt a.arrow::after {
        right: 16px;
        width: 6px;
        height: 6px;
        border-top: 1px solid #231F20;
        border-right: 1px solid #231F20;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }

    #faq .bt a:hover {
        color: #FFF;
        background-color: #231F20;
    }

    #faq .bt a:hover::before {
        background: #FFF;
    }

    #faq .bt a.arrow:hover::after {
        border-top: 1px solid #FFF;
        border-right: 1px solid #FFF;
    }
}


@media screen and (max-width: 499px) {
    
    #faq .title {
        width: 200px;
    }

    #faq .txt {
        padding: 0 5%;
        font-size: 1.6rem;
    }

    #faq .txt br {
        display: none;
    }

    #faq .cover .subT div {
        font-size: 140%;
    }

    #faq .cover .subT span {
        margin: 0.5em 0 0;
        width: 35%;
    }

    #faq .cover .subT.t2 span {
        width: 55%;
    }

    #faq .cover .subT.t3 span {
        width: 17%;
    }

    #faq .cover .subT.t4 span {
        width: 73%;
    }

    #faq .cover .mystaBt a {
        line-height: 150%;
    }

    #ban_area {
        width: 100%;
        margin-right: 0%;
        margin-left: 0px;
    }
    #ban_area div {
        margin-bottom: 0;
    }

}


/*------------------------------------------------------------------
[Interview Page]
*/

/*------------------------------------------------------------------
[Blog Page]
*/

/* PC */


#blog {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    position: relative;
    background-color: #FFF;
}

#blog .catList {
    margin: 0 auto;
    padding: 35px 0;
    width: 100%;
    background-color: #edebe7;
    text-align: center;
}

#blog .catList ul.acc {
    display: block;
}

#blog .catList li {
    margin: 0;
    padding: 0;
    display: inline-block;
    font-size: 1.4rem;
    line-height: 150%;
    text-align: center;
    font-weight: bold;
}

#blog .catList li+li {
    border-left: 1px solid #333;
}

#blog .catList li a {
    padding: 10px 20px;
    transition: .3s;
}

#blog .catList li a:hover {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

#blog .catList div {
    display: none;
}

#blog .catTitle {
    margin: 0 auto;
    padding: 50px 0 0;
    width: 100%;
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}

#blog .mainColumn {
    margin: 0 auto;
    padding: 60px 0 50px;
    width: 980px;
}

#blog .mainColumn ul {
    display: flex;
    flex-wrap: wrap;
}

#blog .mainColumn li {
    width: 33.333%;
    margin: 0;
    padding: 0 2% 40px;
}

#blog .mainColumn li .photo {
    width: 100%;
    height: 180px;
    overflow: hidden;
}

#blog .mainColumn li .photo img {
    width: 100%;
    height: auto;
    transition: .3s;
}

#blog .mainColumn li .sub {
    margin: 0;
    padding: 8px 0 0;
    width: 100%;
    font-size: 1.2rem;
    text-align: left;
    color: #888;
    font-weight: 400;
    transition: .3s;
}

#blog .mainColumn li .sub .cat {
    margin: 0;
    padding: 0 3px 0 0;
    width: auto;
}

#blog .mainColumn li .sub .date {
    margin: 0;
    padding: 0 0 0 3px;
    width: auto;
}

#blog .mainColumn li .title {
    margin: 0;
    padding: 0;
    width: 100%;
    font-size: 1.4rem;
    text-align: left;
    line-height: 140%;
    font-weight: 500;
    transition: .3s;
}

#blog .mainColumn li a {
    display: block;
    width: 100%;
    height: auto;
    transition: .3s;
    padding: 4% 4% 6%;
    background-color: #FFF;
}

#blog .mainColumn li a:hover .photo img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

#blog .mainColumn li a:hover .sub,
#blog .mainColumn li a:hover .title {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

#blog .mainColumn li.rtoc-item {
    display: block !important;
    width: 100% !important;
}
#blog .mainColumn li.rtoc-item a {
    display: block;
    width: 100%;
    height: auto;
    transition: .3s;
    padding: 0 0 10px;
    background-color: #FFF;
}
#blog .mainColumn li.rtoc-item a:hover {
    opacity: 0.4;
    filter: alpha(opacity=40);
}




.wp-pagenavi {
    display: flex;
    margin: 20px 0 0 0;
    width: 100%;
    justify-content: center;
    align-items: center;
    position: relative;
}

.wp-pagenavi a {
    float: left;
    display: flex;
    width: 35px;
    height: 35px;
    margin: 0 8px;
    font-size: 100%;
    color: #000;
    font-weight: bold;
    background-color: #FFF;
    justify-content: center;
    align-items: center;
    border: 2px solid #000;
    transition: .3s;
}

.wp-pagenavi a:hover {
    color: #FFF;
    background-color: #1b1b1b;
    border: 2px solid #000;
}

.wp-pagenavi span.extend {
    border: none;
    background-color: #FFF;
    width: auto;
    margin: -10px 8px 0;
    color: #000;
    font-weight: bold;
}

.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink {
    float: left;
    display: flex;
    width: 35px;
    height: 35px;
    margin: -3px 8px 0;
    font-size: 100%;
    color: #000;
    font-weight: 900;
    background-color: transparent;
    justify-content: center;
    align-items: center;
    border: none;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.wp-pagenavi a.previouspostslink:hover,
.wp-pagenavi a.nextpostslink:hover {
    opacity: 0.3;
    filter: alpha(opacity=30);
}

.wp-pagenavi span {
    float: left;
    display: flex;
    width: 35px;
    height: 35px;
    margin: 0 8px;
    font-size: 100%;
    color: #fff;
    font-weight: bold;
    background-color: #000;
    justify-content: center;
    align-items: center;
    border: 2px solid #000;
}

/* 詳細 */
#blog .leftColumn {
    float: left;
    margin: 0 auto;
    padding: 0 0 40px;
    width: 680px;
    text-align: left;
}

#blog .leftColumn .catD {
    width: auto;
    padding: 0 0 10px;
    font-size: 15px;
    line-height: 150%;
    font-weight: bold;
    text-align: left;
    color: #999;
    float: left;
}

#blog .leftColumn .author {
    width: auto;
    padding: 0 0 10px;
    font-size: 14px;
    line-height: 150%;
    font-weight: bold;
    text-align: right;
    color: #999;
    float: right;
}

#blog .leftColumn .author a {
    color: #2aaae2;
    transition: .3s;
}

#blog .leftColumn .author a:hover {
    opacity: 0.3;
    filter: alpha(opacity=30);
}

#blog .leftColumn h2#postTitle {
    width: 100%;
    padding: 0 0 25px;
    font-size: 2.0rem;
    line-height: 150%;
    text-align: left;
    color: #181818;
}

#blog .leftColumn .iCatch {
    margin: 0 auto;
    padding: 0;
    width: 100%;
}

#blog .leftColumn .iCatch img {
    width: 100%;
    height: auto;
}

#blog .leftColumn .innerBox {
    width: 100%;
    height: auto;
    margin: 25px 0 50px;
    font-size: 16px;
    line-height: 160%;
}

#blog .leftColumn .innerBox h3,
#blog .leftColumn .innerBox h4,
#blog .leftColumn .innerBox h5,
#blog .leftColumn .innerBox h6 {
    font-weight: bold;
    color: #181818;
    line-height: 1.35;
    letter-spacing: normal;
    text-align: left;
}

#blog .leftColumn .innerBox h3 {
    width: 100%;
    margin-top: 35px;
    margin-bottom: 15px;
    padding-bottom: 6px;
    border-bottom: solid 2px #181818;
    font-size: 18px;
}

#blog .leftColumn .innerBox h4 {
    background-repeat: repeat-y;
    background-position: left 9px;
    background-image: url(images/h4_mark.gif);
    margin-top: 35px;
    margin-bottom: 15px;
    padding-left: 15px;
    padding-bottom: 0;
    font-size: 20px;
    border-bottom: none;
}

#blog .leftColumn .innerBox h5 {
    background-repeat: no-repeat;
    background-position: left 7px;
    background-image: url(images/h5_mark.gif);
    padding-left: 15px;
    margin-top: 35px;
    margin-bottom: 15px;
    font-size: 18px;
}

#blog .leftColumn .innerBox h6 {
    margin-top: 25px;
    margin-bottom: 10px;
    font-size: 16px;
}

#blog .leftColumn .innerBox p {
    margin-top: 10px;
    font-size: 1.4rem;
    line-height: 160%;
}

#blog .leftColumn .innerBox p a {
    color: #2aaae2;
    text-decoration: underline !important;
    transition: .3s;
}

#blog .leftColumn .innerBox p a:hover {
    opacity: 0.3;
    filter: alpha(opacity=30);
}

#blog .leftColumn .innerBox img {
    display: inline-block;
    max-width: 100%;
    min-width: 45%;
    width: auto;
    height: auto;
    margin-top: 20px;
}

#blog .leftColumn .innerBox .wp-caption-text {
    margin-top: 10px;
    margin-bottom: 25px;
    color: #666;
    font-size: 1.4rem;
    line-height: 160%;
}

#detail_navi {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 25px;
    text-align: center;
}

#detail_navi a.oldPost,
#detail_navi a.toList,
#detail_navi a.newPost {
    display: block;
    padding: 8px 10px;
    border: solid 1px #181818;
    text-align: center;
    font-size: 14px;
    line-height: 14px;
    text-decoration: none;
    display: block;
    color: #FFF;
    background-color: #181818;
    transition: .3s;
}

#detail_navi a.oldPost {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
}

#detail_navi a.toList {
    width: 160px;
    margin: 0 auto;
    color: #181818;
    background-color: #FFF;
}

#detail_navi a.newPost {
    position: absolute;
    top: 0;
    right: 0;
    width: 80px;
}

#detail_navi a.oldPost:hover,
#detail_navi a.newPost:hover {
    color: #181818;
    background-color: #FFF;
}

#detail_navi a.toList:hover {
    color: #FFF;
    background-color: #181818;
}

.oldPost img,
.toList img,
.newPost img {
    width: auto;
    height: 10px;
    padding-bottom: 3px;
}

.oldPost img {
    padding-right: 8px;
}

.newPost img {
    padding-left: 8px;
}


#blog .rightColumn {
    float: right;
    margin: 0 auto;
    padding: 0 0 20px;
    width: 220px;
    text-align: left;
}

#blog .rightColumn h5 {
    margin: 0 auto;
    padding: 15px 0;
    background-color: #181818;
    width: 100%;
    line-height: 100%;
    text-align: center;
    color: #fff;
    font-size: 1.5rem;
    font-weight: bold;
}

#blog .rightColumn nav {
    margin: 0;
    padding: 0 0 20px;
    width: 100%;
    height: auto;
    display: inline-block;
}

#blog .rightColumn nav ul {
    margin: 0;
    padding: 0;
}

#blog .rightColumn nav ul li {
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    border-bottom: dotted 1px #181818;
}

#blog .rightColumn nav ul li img {
    float: left;
    width: 80px;
    height: auto;
}

#blog .rightColumn nav ul li p {
    float: right;
    width: 130px;
    font-size: 1.2rem;
    line-height: 140%;
    font-weight: normal;
}

#blog .rightColumn nav ul li a {
    margin: 0;
    padding: 16px 0;
    display: block;
    width: 100%;
    height: auto;
    font-size: 1.2rem;
    line-height: 140%;
    font-weight: 400;
    transition: .3s;
    display: inline-table;
}

#blog .rightColumn nav ul li a:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#blog .rightColumn nav ul li a:hover {
    opacity: 0.3;
    filter: alpha(opacity=30);
}

/* 2022/11追記 */

#blog .leftColumn h1#postTitle {
    width: 100%;
    padding: 0 0 25px;
    font-size: 20px;
    line-height: 150%;
    text-align: left;
    color: #181818;
}

#blog .leftColumn .innerBox h2 {
    padding: 1rem 1rem;
    border-top: 6px double #181818;
    border-bottom: 6px double #181818;
    font-size: 24px;
    font-weight: 700;
}

.table1 thead tr .column-1 {
    width: 17%;
}

/* 2022/11追記終了 */



@media (max-width: 1480px){
    #blog .mainColumn {
        width: 90%;
    }
    #blog .leftColumn {
        padding: 0 20px 40px 0;
        width: 75%;
    }
    #blog .rightColumn {
        padding: 0 0 20px 20px;
        width: 25%;
    }
    #blog .rightColumn nav ul li p {
        width: calc(100% - 100px);
    }
}


@media (max-width: 1380px){
    #blog .mainColumn li .photo {
        height: 160px;
    }
}


@media (max-width: 1280px){
    #blog .mainColumn li .photo {
        height: 140px;
    }
}


/* SP */
@media screen and (max-width: 1200px) {
    .pcOnly {
        display: none;
    }

    .spOnly {
        display: block;
    }

    .bg .main {
        z-index: 3;
        position: absolute;
        top: 0px;
        left: 0;
        right: 0;
        margin: auto;
        bottom: 0px;
    }

    #blog {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        position: relative;
    }

    #blog .catList {
        margin: 0 auto;
        padding: 0;
        width: 100%;
        background-color: #edebe7;
        text-align: center;
    }

    #blog .catList ul.acc {
        display: none;
    }

    #blog .catList li {
        margin: 0;
        padding: 0;
        display: block;
        font-size: 100%;
        line-height: 100%;
        text-align: center;
        font-weight: bold;
        border-bottom: 1px solid #999;
    }

    #blog .catList li:first-child {
        border-top: 1px solid #999;
    }

    #blog .catList li+li {
        border-left: none;
    }

    #blog .catList li a {
        display: block;
        padding: 1.5em 0;
        transition: .3s;
    }

    #blog .catList li a:hover {
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

    #blog .catList div {
        margin: 0;
        padding: 1.5em 0;
        display: block;
        font-size: 120%;
        line-height: 100%;
        text-align: center;
        color: #000;
        font-weight: bold;
        text-indent: 35px;
    }

    #blog .catList .accordion_icon,
    #blog .catList .accordion_icon span {
        display: inline-block;
        transition: all .4s;
        box-sizing: border-box;
    }

    #blog .catList .accordion_icon {
        margin: 0 0 0;
        position: relative;
        width: 35px;
        height: 30px;
        float: right;
    }

    #blog .catList .accordion_icon span {
        position: absolute;
        left: 6px;
        width: 50%;
        height: 3px;
        background-color: #000;
    }

    #blog .catList .accordion_icon span:nth-of-type(1) {
        top: 5px;
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
    }

    #blog .catList .accordion_icon span:nth-of-type(2) {
        top: 5px;
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
    }

    /*＋、－切り替え*/
    #blog .catList .accordion_icon.active span:nth-of-type(1) {
        display: none;
    }

    #blog .catList .accordion_icon.active span:nth-of-type(2) {
        top: 5px;
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
    }

    #blog .catTitle {
        margin: 0 auto;
        padding: 2em 0 0;
        width: 100%;
        font-size: 170%;
        text-align: center;
        font-weight: bold;
    }

    #blog .mainColumn {
        margin: 0 auto;
        padding: 3em 0 2em;
        width: 100%;
    }

    #blog .mainColumn li {
        float: none;
        margin: 0;
        padding: 0 1% 30px;
        width: 49.9%;
        height: auto;
    }

    #blog .mainColumn li:nth-child(3n) {
        margin: 0;
    }

    #blog .mainColumn li .photo {
        width: 100%;
        height: 210px;
        overflow: hidden;
        padding: 0;
        position: relative;
    }

    #blog .mainColumn li .photo img {
        width: 100%;
        height: auto;
        transition: .3s;
        position: absolute;
        top: 0;
        left: 0;
    }

    #blog .mainColumn li .sub {
        margin: 0;
        padding: 8px 0 0;
        width: 100%;
        font-size: 1.2rem;
        text-align: left;
        color: #888;
        font-weight: bold;
        transition: .3s;
    }

    #blog .mainColumn li .sub .cat {
        margin: 0;
        padding: 0 5px 0 0;
        width: auto;
    }

    #blog .mainColumn li .sub .date {
        margin: 0;
        padding: 0 0 0 5px;
        width: auto;
    }

    #blog .mainColumn li .title {
        margin: 0;
        padding: 0;
        width: 100%;
        font-size: 1.4rem;
        text-align: left;
        line-height: 140%;
        font-weight: bold;
        transition: .3s;
    }

    #blog .mainColumn li a {
        width: 100%;
        height: auto;
        display: block;
        transition: .3s;
    }

    #blog .mainColumn li a:hover .photo img {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -o-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
    }

    #blog .mainColumn li a:hover .sub,
    #blog .mainColumn li a:hover .title {
        opacity: 0.4;
        filter: alpha(opacity=40);
    }




    .wp-pagenavi {
        display: flex;
        margin: 0;
        width: 100%;
        justify-content: center;
        align-items: center;
        position: relative;
    }

    .wp-pagenavi a {
        float: left;
        display: flex;
        width: 35px;
        height: 35px;
        margin: 0 8px;
        font-size: 100%;
        color: #000;
        font-weight: bold;
        background-color: #FFF;
        justify-content: center;
        align-items: center;
        border: 2px solid #000;
        transition: .3s;
    }

    .wp-pagenavi a:hover {
        color: #FFF;
        background-color: #1b1b1b;
        border: 2px solid #000;
    }

    .wp-pagenavi span.extend {
        border: none;
        background-color: #FFF;
        width: auto;
        margin: -10px 8px 0;
        color: #000;
        font-weight: bold;
    }

    .wp-pagenavi a.previouspostslink,
    .wp-pagenavi a.nextpostslink {
        float: left;
        display: flex;
        width: 35px;
        height: 35px;
        margin: -3px 8px 0;
        font-size: 100%;
        color: #000;
        font-weight: 900;
        background-color: transparent;
        justify-content: center;
        align-items: center;
        border: none;
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    }

    .wp-pagenavi a.previouspostslink:hover,
    .wp-pagenavi a.nextpostslink:hover {
        opacity: 0.3;
        filter: alpha(opacity=30);
    }

    .wp-pagenavi span {
        float: left;
        display: flex;
        width: 35px;
        height: 35px;
        margin: 0 8px;
        font-size: 100%;
        color: #fff;
        font-weight: bold;
        background-color: #000;
        justify-content: center;
        align-items: center;
        border: 2px solid #000;
    }

    /* 詳細 */
    #blog .leftColumn {
        float: none;
        margin: 0 auto;
        padding: 0 0 2em;
        width: 100%;
    }

    #blog .leftColumn .catD {
        width: auto;
        padding: 0 0 10px;
        font-size: 110%;
        line-height: 150%;
        font-weight: bold;
        text-align: left;
        color: #999;
        float: left;
    }

    #blog .leftColumn .author {
        width: auto;
        padding: 0 0 10px;
        font-size: 90%;
        line-height: 150%;
        font-weight: bold;
        text-align: right;
        color: #999;
        float: right;
    }

    #blog .leftColumn .author a {
        color: #2aaae2;
        transition: .3s;
    }

    #blog .leftColumn .author a:hover {
        opacity: 0.3;
        filter: alpha(opacity=30);
    }

    #blog .leftColumn h2#postTitle {
        width: 100%;
        padding: 0 0 1em;
        font-size: 150%;
        line-height: 150%;
        text-align: left;
        color: #181818;
    }

    #blog .leftColumn .iCatch {
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }

    #blog .leftColumn .iCatch img {
        width: 100%;
        height: auto;
    }

    #blog .leftColumn .innerBox {
        width: 100%;
        height: auto;
        margin: 25px 0 50px;
        font-size: 100%;
        line-height: 160%;
    }

    #blog .leftColumn .innerBox h3,
    #blog .leftColumn .innerBox h4,
    #blog .leftColumn .innerBox h5,
    #blog .leftColumn .innerBox h6 {
        font-weight: bold;
        color: #181818;
        line-height: 1.35;
        letter-spacing: normal;
        text-align: left;
    }

    #blog .leftColumn .innerBox h3 {
        width: 100%;
        margin-top: 35px;
        margin-bottom: 1em;
        padding-bottom: 6px;
        border-bottom: solid 2px #181818;
        font-size: 140%;
    }

    #blog .leftColumn .innerBox h4 {
        background-repeat: repeat-y;
        background-position: left 9px;
        background-image: url(images/h4_mark.gif);
        margin-top: 35px;
        margin-bottom: 1em;
        padding-left: 15px;
        padding-bottom: 0;
        font-size: 135%;
        border-bottom: none;
    }

    #blog .leftColumn .innerBox h5 {
        background-repeat: no-repeat;
        background-position: left 7px;
        background-image: url(images/h5_mark.gif);
        padding-left: 15px;
        margin-top: 35px;
        margin-bottom: 1em;
        font-size: 130%;
    }

    #blog .leftColumn .innerBox h6 {
        margin-top: 25px;
        margin-bottom: 10px;
        font-size: 110%;
    }

    #blog .leftColumn .innerBox p {
        margin-top: 10px;
        font-size: 16px;
        line-height: 160%;
    }

    #blog .leftColumn .innerBox img {
        display: inline-block;
        max-width: 100%;
        min-width: 45%;
        width: auto;
        height: auto;
        margin-top: 20px;
    }

    #blog .leftColumn .innerBox .wp-caption-text {
        margin-top: 10px;
        margin-bottom: 25px;
        color: #666;
        font-size: 14px;
        line-height: 160%;
    }

    #detail_navi {
        position: relative;
        width: 100%;
        height: auto;
        margin-top: 25px;
        text-align: center;
    }

    #detail_navi a.oldPost,
    #detail_navi a.toList,
    #detail_navi a.newPost {
        display: block;
        padding: 8px 10px;
        border: solid 1px #181818;
        text-align: center;
        font-size: 14px;
        line-height: 14px;
        text-decoration: none;
        display: block;
        color: #FFF;
        background-color: #181818;
        transition: .3s;
    }

    #detail_navi a.oldPost {
        position: absolute;
        top: 0;
        left: 0;
        width: 20%;
    }

    #detail_navi a.toList {
        width: 35%;
        margin: 0 auto;
        color: #181818;
        background-color: #FFF;
    }

    #detail_navi a.newPost {
        position: absolute;
        top: 0;
        right: 0;
        width: 20%;
    }

    #detail_navi a.oldPost:hover,
    #detail_navi a.newPost:hover {
        color: #181818;
        background-color: #FFF;
    }

    #detail_navi a.toList:hover {
        color: #FFF;
        background-color: #181818;
    }

    .oldPost img,
    .toList img,
    .newPost img {
        width: auto;
        height: 10px;
        padding-bottom: 3px;
    }

    .oldPost img {
        padding-right: 8px;
    }

    .newPost img {
        padding-left: 8px;
    }


    #blog .rightColumn {
        display: none;
    }


    /* 2022/11追記 */

    #blog .leftColumn h1#postTitle {
        width: 100%;
        padding: 0 0 1em;
        font-size: 155%;
        line-height: 150%;
        text-align: left;
        color: #181818;
    }

    #blog .leftColumn .innerBox h2 {
        font-size: 145%;
        padding: 0.5em;
    }

    .table1 thead tr .column-1 {
        width: 19%;
    }
    /* 2022/11追記終了 */
}


@media (max-width: 1080px){
    #blog .mainColumn li .photo {
        height: 190px;
    }
}


@media (max-width: 990px){
    #blog .mainColumn li .photo {
        height: 210px;
    }
}


@media (max-width: 499px){
    #detail_navi a.oldPost {
        width: 30%;
    }
    #detail_navi a.newPost {
        width: 30%;
    }
    #detail_navi a.oldPost,
    #detail_navi a.toList,
    #detail_navi a.newPost {
        font-size: 12px;
        line-height: 12px;
    }
    #blog .mainColumn li .photo {
        height: 100px;
    }

    #blog .leftColumn h2#postTitle {
        font-size: 1.8rem;
    }
    #blog .leftColumn .innerBox {
        padding: 0 4%;
    }
}

@media (max-width: 360px){
    #blog .mainColumn li .photo {
        height: 94px;
    }
}


/*------------------------------------------------------------------
[Media Page]
*/
#maga {
    width: 100%;
}

#maga .cover {
    width: 930px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 50px;
    padding-bottom: 100px;
    position: relative;
}

#maga .cover .title {
    width: 226px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 50px;
}

#maga .cover .title p {
    font-size: 18px;
    font-weight: normal;
    text-align: center;
    padding-top: 5px;
    margin: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}

#maga .cover .box {
    width: 930px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 20px;
    border-bottom: 1px solid #BBB;
    margin-bottom: 40px;
}

#maga .cover .box .box_l {
    float: left;
    width: 200px;
    position: relative;
}

#maga .cover .box .box_l img {
    width: 100%;
    height: auto;
    z-index: 1;
}

#maga .cover .box .box_l .new {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 2;
}

#maga .cover .box .box_l .new img {
    width: 42px;
    height: 42px;
}

#maga .cover .box .box_r {
    float: right;
    width: 700px;
}

#maga .cover .box .box_r .label {
    float: left;
    width: 50px;
    font-size: 14px;
    line-height: 100%;
    color: #FFF;
    text-align: center;
    padding: 5px;
    margin-right: 10px;
}

#maga .cover .box .box_r .label.media_book {
    background-color: #CC8BC0;
}

#maga .cover .box .box_r .label.media_web {
    background-color: #80BCD6;
}

#maga .cover .box .box_r .label.media_tv {
    background-color: #CEC2A7;
}

#maga .cover .box .box_r .label.media_pr {
    background-color: #96d680;
}

#maga .cover .box .box_r .box_t {
    width: 100%;
    font-size: 16px;
    line-height: 160%;
    text-align: left;
}

#maga .cover .box .box_r .box_t strong {
    font-size: 18px;
}

#maga .cover .box .box_r p {
    width: 100%;
    font-size: 14px;
    line-height: 150%;
    text-align: left;
    padding-top: 10px;
}


.pagination {
    position: relative;
    width: 930px;
    min-height: 33px;
    margin-top: 0px;
    text-align: center;
}

.pagination .sp_present {
    display: none;
}

.pagination .page {
    display: inline-block;
    padding: 7px 10px;
    margin-right: 4px;
    border: solid 1px #333;
    border-radius: 2px;
    font-size: 16px;
    line-height: 16px;
    text-decoration: none;
    color: #333;
}

.pagination .page:hover,
.pagination .first:hover,
.pagination .prev:hover,
.pagination .next:hover,
.pagination .last:hover {
    background: #c0d6ec;
    text-decoration: none;
}

.pagination .page.active {
    background: #333;
    color: #fff;
    font-weight: bold;
    border: solid 1px #333;
}

.pagination .first img,
.pagination .prev img,
.pagination .next img,
.pagination .last img {
    width: auto;
    height: 10px;
    padding-bottom: 3px;
}

.pagination .prev img {
    padding-right: 8px;
}

.pagination .next img {
    padding-left: 8px;
}

.pagination .first,
.pagination .prev,
.pagination .next,
.pagination .last {
    position: absolute;
    top: 0;
    display: inline-block;
    padding: 7px 10px;
    margin-right: 4px;
    border: solid 1px #333;
    border-radius: 2px;
    font-size: 16px;
    line-height: 16px;
    text-decoration: none;
    color: #333;
}

.pagination .first {
    left: 0;
}

.pagination .prev {
    left: 37px;
}

.pagination .next {
    right: 37px;
}

.pagination .last {
    right: 0;
}

/* SP */
@media screen and (max-width: 1200px) {
    .pcOnly {
        display: none;
    }

    .spOnly {
        display: block;
    }


    #maga {
        width: 100%;
    }

    #maga .cover {
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-top: 2em;
        padding-bottom: 3em;
        position: relative;
    }

    #maga .cover .title {
        width: 60%;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }

    #maga .cover .title img {
        width: 100%;
    }

    #maga .cover .title p {
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
        margin: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }

    #maga .cover .box {
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 1em;
        border-bottom: 1px solid #BBB;
        margin-bottom: 2em;
    }

    #maga .cover .box .box_l {
        float: none;
        margin: 0 auto;
        width: 80%;
        position: relative;
    }

    #maga .cover .box .box_l img {
        width: 100%;
        height: auto;
        z-index: 1;
    }

    #maga .cover .box .box_l .new {
        width: 42px;
        height: 42px;
        position: absolute;
        left: 0px;
        top: 0px;
        z-index: 2;
    }

    #maga .cover .box .box_l .new img {
        width: 42px;
        height: 42px;
    }

    #maga .cover .box .box_r {
        float: none;
        width: 100%;
        padding-top: 1.5em;
    }

    #maga .cover .box .box_r .label {
        float: none;
        width: 50px;
        font-size: 100%;
        line-height: 100%;
        color: #FFF;
        text-align: center;
        padding: 5px;
        margin-right: 10px;
    }

    #maga .cover .box .box_r .label.media_book {
        background-color: #CC8BC0;
    }

    #maga .cover .box .box_r .label.media_web {
        background-color: #80BCD6;
    }

    #maga .cover .box .box_r .label.media_tv {
        background-color: #CEC2A7;
    }

    #maga .cover .box .box_r .label.media_pr {
        background-color: #96d680;
    }

    #maga .cover .box .box_r .box_t {
        width: 100%;
        font-size: 110%;
        line-height: 160%;
        text-align: left;
    }

    #maga .cover .box .box_r .box_t strong {
        font-size: 120%;
    }

    #maga .cover .box .box_r p {
        width: 100%;
        font-size: 100%;
        line-height: 150%;
        text-align: left;
        padding-top: 1em;
    }


    .pagination {
        width: 100%;
        height: auto;
        margin-top: 0px;
        text-align: center;
    }

    .pagination .sp_present {
        display: block;
        width: 100%;
        height: auto;
        padding-bottom: 20px;
        text-align: center;
        color: #666;
        font-size: 14px;
    }

    .pagination .sp_present span {
        display: inline-block;
        padding-right: 10px;
        color: #333;
        font-size: 16px;
    }

    .pagination .page {
        display: none;
    }

    .pagination .first,
    .pagination .prev,
    .pagination .next,
    .pagination .last {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        display: inline-block;
        margin-right: 0.56%;
        border: solid 1px #333;
        border-radius: 4px;
        font-size: 16px;
        line-height: 16px;
        text-decoration: none;
        color: #333;
        text-align: center;
    }

    .pagination a:last-child {
        margin-right: 0;
    }

    .pagination .first,
    .pagination .last {
        width: 11.34%;
        padding: 11px 0;
    }

    .pagination .prev,
    .pagination .next {
        width: 36.56%;
        padding: 11px 0;
        text-align: center;
    }

    .pagination .first img,
    .pagination .prev img,
    .pagination .next img,
    .pagination .last img {
        width: auto;
        height: 10px;
        padding-bottom: 3px;
    }

    .pagination .prev img {
        padding-right: 8px;
    }

    .pagination .next img {
        padding-left: 8px;
    }
}



/*------------------------------------------------------------------
[Works Page]
*/

#design{
	width: 100%;
	padding-top: 50px;
	padding-bottom: 50px;
    background-color: #FFF;
}
#design .title{
	width: 274px;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 40px;
}
#design .title p{
	width: 100%;
	font-size: 18px;
	font-weight: normal;
	text-align: center;
	padding-top: 5px;
	margin: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}


#design ul.cat_box{
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 60px;
	text-align: center;
}
#design ul.cat_box li{
	width: 130px;
	display: inline-block;
	margin-top: 4px;
	margin-right: 2px;
	margin-bottom: 4px;
	margin-left: 2px;
	cursor: pointer;
	font-size: 12px;
	padding-top: 5px;
	padding-bottom: 5px;
	border: 1px solid #231F20;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 30px;
    -webkit-border-radius: 30px; 
    -moz-border-radius: 30px;
	-webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
#design ul.cat_box li:hover{
	color: #FFF;
	background-color: #231F20;
}



#design .bt-area-graphic {
    width: 400px;
    margin-top: 20px;
    margin-bottom: 80px;
    margin-right: auto;
    margin-left: auto;
}

#design .bt-area-graphic .bt {
    position: relative;
    -webkit-filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
    filter: drop-shadow(2px 2px 2px rgba(0, 0, 0, .3));
}

#design .bt-area-graphic .bt.bt_l {
    width: 96%;
    margin-top: 0;
    margin-left: 2%;
    margin-right: 2%;
    ;
}

#design .bt-area-graphic .bt.bt_l a {
    width: 100%;
    font-size: 1.4rem;
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #FFF;
    display: block;
    border: 1px solid #231F20;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    color: #000;
}

#design .bt-area-graphic .bt.bt_l a.arrow {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
}

#design .bt-area-graphic .bt.bt_l a.arrow::before,
#design .bt-area-graphic .bt.bt_l a.arrow::after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}

#design .bt-area-graphic .bt.bt_l a.arrow::before {
    right: 14px;
    width: 15px;
    height: 1px;
    background: #000;
}

#design .bt-area-graphic .bt.bt_l a.arrow::after {
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

#design .bt-area-graphic .bt.bt_l a:hover {
    color: #FFF;
    background-color: #231F20;
    border: 1px solid #231F20;
}

#design .bt-area-graphic .bt.bt_l a:hover::before {
    background: #FFF;
}

#design .bt-area-graphic .bt.bt_l a.arrow:hover::after {
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}



#design .g_box{
    display: flex;
    flex-wrap: wrap;
    width: 930px;
    margin-right: auto;
    margin-left: auto;
}
#design .g_box .box{
	position: relative;
	text-align: left;
    margin-top: 0;
    margin-left: 0;
	margin-right: 0;
    margin-bottom: 0;
	padding-bottom: 30px;
}
#design .g_box .box a{
	display: block;
    width: 100%;
    height: 100%;
	-webkit-transition: opacity 0.3s ease-out;
    -moz-transition: opacity 0.3s ease-out;
    -ms-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out;
    padding: 8px 8px 15px;
    margin: 0;
    background-color: #FFF;
    border: 1px solid #EEE;
    box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -webkit-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
    -moz-box-shadow: rgba(122, 122, 122, 0.1) 0px 0px 6px 3px;
}
#design .g_box .box a:hover{
    opacity:0.5;
    filter: alpha(opacity=50);
}
#design .g_box .box img{
	width: 100%;
	height: auto;
	z-index: 1;
}
#design .g_box .box .new{
	width: 42px;
	height: 42px;
	position: absolute;
	left: 15px;
	top: 0;
	z-index: 2;
}
#design .g_box .box .new img{
	width: 42px;
	height: 42px;
}
#design .g_box .box p{
	width: 90%;
	font-size: 1.2rem;
	font-weight: 500;
	line-height: 1.4;
    margin: 0 auto;
    padding: 10px 5px 5px;
    border-bottom: solid 1px #CCC;
}
#design .g_box .box .place{
	width: 90%;
	font-size: 1.0rem;
	font-weight: 400;
	line-height: 1.4;
    margin: 0 auto;
    padding: 5px 5px 0;
}
#design .g_box .box .place div{
	font-size: 12px;
	color: #FFF;
	text-align: center;
    padding-top: 4px;
    padding-bottom: 4px;
	padding-right: 6px;
	padding-left: 6px;
	float: right;
}
#design .g_box .box .place div.design{
	background-color: #CC8BC0;
}
#design .g_box .box .place div.graphic{
	background-color: #80BCD6;
}
#design .g_box .box .place div.web{
	background-color: #CEC2A7;
}

#design .info{
	font-size: 24px;
	line-height: 140%;
	font-weight: bold;
	background-image: url(../images/arrow.png);
	background-repeat: no-repeat;
	background-position: center bottom;
	padding-bottom: 95px;
	margin-top: 20px;
}

#design .bt{
	margin-right: auto;
	margin-left: auto;
	margin-top: 40px;
	position: relative;
	-webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
        filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
}
#design .bt a{
	width: 480px;
	font-size: 18px;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #FFF;
	display: block;
	border: 1px solid #231F20;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#design .bt a.arrow{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	text-decoration: none;
	font-size: 18px;
}
#design .bt a.arrow::before,
#design .bt a.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
#design .bt a.arrow::before{
    right: 14px;
    width: 15px;
    height: 1px;
    background: #231F20;
}
#design .bt a.arrow::after{
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #231F20;
    border-right: 1px solid #231F20;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
#design .bt a:hover{
	color: #FFF;
	background-color: #231F20;
}
#design .bt a:hover::before{
	background: #FFF;
}
#design .bt a.arrow:hover::after{
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
}


/* 20230930 追記　ここから */
#design .cover .lr_box{
    display: flex;
    padding: 0 10%;
}

#design .cover .l_box{
    display: flex;
    flex-direction: column;
	width: 50%;
}
#design .cover .l_box .label{
    display: block;
    margin-bottom: 20px;
	padding: 10px;
	width: 130px;
	font-size: 16px;
	line-height: 100%;
	text-align: center;
	color: #CA70A3;
	border: 1px solid #CA70A3;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
#design .cover .l_box .c_title{
    display: block;
	width: 100%;
	font-size: 24px;
	line-height: 120%;
	font-weight: bold;
	text-align: left;
    margin: 0;
	padding-bottom: 20px;
}

#design .cover .l_box p,
#design .cover .box p{
    display: block;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	font-size: 14px;
	line-height: 1.5;
	text-align: left;
    padding-top: 8px;
    padding-bottom: 8px;
}

#design .cover .l_box div{
    display: block;
	padding-right: 0px;
    text-align: left;
}
#design .cover .l_box strong{
	color: #CA70A3;
}
#design .cover .l_box div a{
	text-decoration: underline;
}
#design .cover .l_box div a:hover{
	text-decoration: none;
}
#design .cover .photo{
    display: block;
	width: 50%;
	margin-right: auto;
	margin-left: auto;
    padding: 0 2% 20px;
}
#design .cover .photo img{
	width: 100%;
	height: auto;
}
#design .cover .catch{
	margin: 0 auto;
	padding: 50px 0 30px;
	width: 80%;
	border-bottom: 1px dashed #999;
}

#design .cover .box .question{
    position: relative;
    display: block;
	padding: 0 0 15px 30px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	font-size: 16px;
	line-height: 140%;
	color: #999;
	font-weight: bold;
	text-align: left;
	background-position: left 10px;
	background-repeat: no-repeat;
}
#design .cover .box .question::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
	width: 20px;
    height: 2px;
    background-color: #999;
}

#design .cover .catch .question {
    position: relative;
    display: block;
	padding: 0 0 15px 30px;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	font-size: 16px;
	line-height: 140%;
	color: #999;
	font-weight: bold;
	text-align: left;
}
#design .cover .catch .question::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 0;
	width: 20px;
    height: 2px;
    background-color: #999;
}

#design .cover .catch p{
    width: 100%;
	font-size: 22px;
	line-height: 140%;
	font-weight: bold;
	text-align: left;
	color: #CA70A3;
}

#design .cover .box{
	margin: 0 auto;
	padding: 30px 0 30px;
	width: 80%;
	border-bottom: 1px dashed #999;
}
#design .cover .box.non{
	border-top: none;
}
#design .cover .box .question,
#design .cover .box p{
	font-size: 14px;
}
#design .cover .p_box{
    display: flex;
	margin: 0 auto;
	padding: 30px 0 30px;
	width: 80%;
}
#design .cover .p_box img{
	width: 50%;
	height: auto;
    padding: 0 2%;
}
#design .cover .p_box img:last-child{
	margin-right: 0;
}
#design .cover .sanks{
	margin: 30px auto 0;
	font-size: 22px;
	color: #CA70A3;
	font-weight: bold;
	text-align: center;
}

@media (max-width: 1200px){
    #design .cover .lr_box {
        display: block;
        padding: 0 10%;
    }
    #design .cover .l_box {
        display: block;
        width: 100%;
    }
    #design .cover .photo {
        width: 100%;
        padding: 40px 0 0;
    }
    #design .cover .p_box {
        display: block;
        width: 80%;
        padding: 30px 0 0;
    }
    #design .cover .p_box img {
        width: 100%;
        height: auto;
        padding: 0 0 30px;
    }
}
@media (max-width: 499px){
    #design .cover .lr_box {
        padding: 0 5%;
    }
    #design .cover .p_box {
        width: 90%;
    }
    #design .cover .l_box .c_title {
        font-size: 20px;
        line-height: 140%;
    }
    #design .cover .catch p {
        font-size: 20px;
    }
    #design .cover .sanks{
        font-size: 18px;
    }
}
/* 20230930 追記　ここまで */


/* 詳細 */
#design .c_title{
	width: 722px;
	margin-right: auto;
	margin-left: auto;
	font-size: 36px;
	line-height: 120%;
	font-weight: bold;
	padding-bottom: 20px;
}

#design .bxslider{
	width: 722px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 5px;
}
#design .bxslider li{
	width: 722px;
}

#design p{
	width: 722px;
	margin-right: auto;
	margin-left: auto;
	font-size: 18px;
	line-height: 140%;
	padding-top: 20px;
	padding-bottom: 20px;
}

#design .dataCover{
	margin: 25px auto 0;
	width: 722px;
}
#design .dataCover .data{
	float: left;
	width: 362px;
	border: 2px solid #231815;
	padding-left: 45px;
	background-color: #FFF;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	text-align: left;
	padding-top: 15px;
	padding-bottom: 5px;
}
#design .dataCover .data .label{
	width: 31px;
	height: 161px;
	margin: auto;
	position: absolute;
	left: 8px;
	top: -10px;
	background-image: url(../images/label2.png);
	background-repeat: no-repeat;
	background-position: center top -5px;
}
#design .dataCover .data .label p{
	width: 20px;
	height: auto;
	font-size: 14px;
	line-height: 1.5;
	font-weight: 500;
	color: #FFF;
	text-align: left;
	padding-top: 8px;
	padding-right: 0px;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

#design .dataCover .data .left{
	float: left;
	width: 280px;
	font-size: 15px;
	padding-bottom: 10px;
}
#design .dataCover .data .left div{
	float: left;
	text-align: right;
	width: 65px;
}
#design .dataCover .data .left .con{
	float: right;
	text-align: left;
	width: 195px;
	padding-left: 0px;
}
#design .dataCover .data .right{
	float: right;
	width: 223px;
	font-size: 15px;
	padding-bottom: 10px;
}
#design .dataCover .data .right div{
	float: left;
	text-align: right;
	width: 65px;
}
#design .dataCover .data .right .con{
	float: right;
	text-align: left;
	width: 133px;
	padding-left: 15px;
}
#design .dataCover .drawing{
	float: right;
	width: 342px;
	height: 165px;
	border: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
}
#design .dataCover .drawing img{
	width: 100%;
	height: auto;
	object-fit: cover;
}
#design .dataCover .drawing a{
    transition: .3s;
}
#design .dataCover .drawing a:hover{
    opacity:0.5;
    filter: alpha(opacity=50);
}
#design .dataCover .drawingNo{
	float: right;
	padding: 70px 0 0;
	width: 342px;
	height: 165px;
	border: 2px solid #231815;
	background-color: #FFF;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 19px;
	line-height: 100%;
	font-weight: bold;
	color: #231815;
	text-align: center;
}

#design .bt_back{
	width: 295px;
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 65px;
}
#design .bt_back a{
	font-size: 18px;
	font-weight: bold;
	padding-top: 8px;
	padding-bottom: 8px;
	background-color: #FFF;
	display: block;
	border: 1px solid #231F20;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#design .bt_back a:hover{
	color: #FFF;
	background-color: #231F20;
}

#detail_navi {
	position: relative;
	width: 80%;
	height    : auto;
	margin: 65px auto 0;
	text-align: center;
}
#detail_navi a.oldPost,
#detail_navi a.toList,
#detail_navi a.newPost {
	display        : block;
    padding        : 7px 10px;
    border         : solid 1px #181818;
	text-align     : center;
    font-size      : 16px;
	line-height    : 16px;
    text-decoration: none;
	display: block;
	color: #FFF;
	background-color: #181818;
	transition: .3s;
}
#detail_navi a.oldPost {
	position: absolute;
	top: 0;
	left    : 0;
	width   : 80px;
}
#detail_navi a.toList {
	width : 160px;
	margin: 0 auto;
	color: #181818;
	background-color: #FFF;
}
#detail_navi a.newPost {
	position: absolute;
	top: 0;
	right   : 0;
	width   : 80px;
}
#detail_navi a.oldPost:hover,
#detail_navi a.newPost:hover {
	color: #181818;
	background-color: #FFF;
}
#detail_navi a.toList:hover{
	color: #FFF;
	background-color: #181818;
}
.oldPost img,
.toList img,
.newPost img {
	width         : auto;
	height        : 10px;
	padding-bottom: 3px;
}
.oldPost img {
	padding-right: 8px;
}
.newPost img {
	padding-left: 8px;
}


@media (max-width: 1380px){
    #design .g_box{
        width: 96%;
        margin-right: auto;
        margin-left: auto;
    }
}

/* SP */
@media screen and (max-width: 1200px){
    #design{
        width: 100%;
        padding-top: 2em;
        padding-bottom: 2em;
    }
    #design .title{
        width: 180px;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 2em;
    }
    #design .title img{
        width: 100%;
    }
    #design .title p{
        width: 100%;
        font-size: 100%;
        font-weight: normal;
        text-align: center;
        padding-top: 5px;
    }
    
    
    #design ul.cat_box{
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        padding-bottom: 3em;
        text-align: center;
    }
    #design ul.cat_box li{
        width: 46%;
        margin-top: 0px;
        margin-right: 2%;
        margin-bottom: 0.5em;
        margin-left: 2%;
        cursor: pointer;
        font-size: 12px;
        padding-top: 5px;
        padding-bottom: 5px;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 30px;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
        float: left;
    }
    #design ul.cat_box li:hover{
        color: #FFF;
        background-color: #231F20;
    }
    
    #design .g_box{
        width: 92%;
        margin-right: auto;
        margin-left: auto;
    }
    #design .g_box .box{
        text-align: left;
        padding-bottom: 3em;
    }
    #design .g_box .box a{
        display: block;
        padding: 5px 5px 15px;
        -webkit-transition: opacity 0.3s ease-out;
        -moz-transition: opacity 0.3s ease-out;
        -ms-transition: opacity 0.3s ease-out;
        transition: opacity 0.3s ease-out;
    }
    #design .g_box .box a:hover{
      opacity:0.5;
      filter: alpha(opacity=50);
    }
    #design .g_box .box img{
        width: 100%;
        height: auto;
        z-index: 1;
    }
    #design .g_box .box .new{
        width: 42px;
        height: 42px;
        position: absolute;
        left: 15px;
        top: 0px;
        z-index: 2;
    }
    #design .g_box .box .new img{
        width: 42px;
        height: 42px;
    }
    #design .g_box .box p{
        font-size: 13px;
    }
    #design .g_box .box .place{
        font-size: 11px;
    }
    #design .g_box .box .place div{
        font-size: 14px;
        color: #FFF;
        text-align: center;
        float: right;
    }
    #design .g_box .box .place div.design{
        background-color: #CC8BC0;
    }
    #design .g_box .box .place div.graphic{
        background-color: #80BCD6;
    }
    #design .g_box .box .place div.web{
        background-color: #CEC2A7;
    }
    
    #design .info{
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        font-size: 140%;
        line-height: 140%;
        font-weight: bold;
        background-image: url(../images/arrow.png);
        background-repeat: no-repeat;
        background-position: center bottom;
        padding-bottom: 95px;
        margin-top: 0px;
    }
    
    #design .bt{
        margin-right: auto;
        margin-left: auto;
        margin-top: 2em;
        position: relative;
        -webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
            filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
    }
    #design .bt a{
        width: 90%;
        font-size: 120%;
        padding-top: 20px;
        padding-bottom: 20px;
        background-color: #FFF;
        display: block;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }
    #design .bt a.arrow{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        text-decoration: none;
        font-size: 18px;
    }
    #design .bt a.arrow::before,
    #design .bt a.arrow::after{
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        margin: auto;
        content: "";
        vertical-align: middle;
    }
    #design .bt a.arrow::before{
        right: 14px;
        width: 15px;
        height: 1px;
        background: #231F20;
    }
    #design .bt a.arrow::after{
        right: 16px;
        width: 6px;
        height: 6px;
        border-top: 1px solid #231F20;
        border-right: 1px solid #231F20;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    #design .bt a:hover{
        color: #FFF;
        background-color: #231F20;
    }
    #design .bt a:hover::before{
        background: #FFF;
    }
    #design .bt a.arrow:hover::after{
        border-top: 1px solid #FFF;
        border-right: 1px solid #FFF;
    }
    
    
    /* 詳細 */
    #design .c_title{
        width: 95%;
        margin-right: auto;
        margin-left: auto;
        font-size: 140%;
        line-height: 120%;
        font-weight: bold;
        padding-bottom: 1em;
    }
    
    #design .bxslider{
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }
    #design .bxslider li{
        width: 100%;
    }
    
    #design p{
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        font-size: 110%;
        line-height: 140%;
        padding-top: 1em;
        padding-bottom: 1em;
    }
    
    #design .dataCover{
        margin: 2em auto 0;
        width: 90%;
    }
    #design .dataCover .data{
        float: none;
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        border: 2px solid #231815;
        padding-left: 10%;
        background-color: #FFF;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        position: relative;
        text-align: left;
        padding-top: 1.5em;
        padding-bottom: 1em;
    }
    #design .dataCover .data .label{
        width: 31px;
        height: 161px;
        margin: auto;
        position: absolute;
        left: 8px;
        top: -15px;
        bottom: auto;
        background-image: url(../images/label2.png);
        background-repeat: no-repeat;
        background-position: center top -5px;
    }
    #design .dataCover .data .label p{
        font-size: 14px;
        line-height: 1.5;
        font-weight: 500;
        color: #FFF;
        text-align: left;
        padding-top: 10px;
        padding-left: 8px;
        -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
    }
    
    #design .dataCover .data .left{
        float: none;
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        font-size: 100%;
        padding-bottom: 2.5em;
    }
    #design .dataCover .data .left div{
        float: left;
        text-align: right;
        width: 20%;
    }
    #design .dataCover .data .left .con{
        float: right;
        text-align: left;
        width: 75%;
        padding-left: 5%;
    }
    #design .dataCover .data .right{
        float: none;
        width: 100%;
        margin-right: auto;
        margin-left: auto;
        font-size: 100%;
        padding-bottom: 10px;
    }
    #design .dataCover .data .right div{
        float: left;
        text-align: right;
        width: 20%;
    }
    #design .dataCover .data .right .con{
        float: right;
        text-align: left;
        width: 75%;
        padding-left: 5%;
    }
    #design .dataCover .drawing{
        float: none;
        width: 100%;
        height: auto;
        border: 1px solid #ccc;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        overflow: hidden;
        margin-top: 1.5em;
    }
    #design .dataCover .drawing img{
        width: 100%;
        height: auto;
        object-fit: cover;
    }
    #design .dataCover .drawing a{
     transition: .3s;
    }
    #design .dataCover .drawing a:hover{
      opacity:0.5;
      filter: alpha(opacity=50);
    }
    #design .dataCover .drawingNo{
        float: none;
        margin-top: 1.5em;
        padding: 4.4em 0;
        width: 100%;
        height: auto;
        border: 2px solid #231815;
        background-color: #FFF;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 120%;
        line-height: 100%;
        font-weight: bold;
        color: #231815;
        text-align: center;
    }
    
    #design .bt_back{
        width: 90%;
        margin-top: 2em;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 4em;
    }
    #design .bt_back a{
        font-size: 100%;
        font-weight: bold;
        padding-top: 8px;
        padding-bottom: 8px;
        background-color: #FFF;
        display: block;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 30px;
        -webkit-border-radius: 30px;
        -moz-border-radius: 30px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }
    #design .bt_back a:hover{
        color: #FFF;
        background-color: #231F20;
    }
    
    #detail_navi {
        position  : relative;
        width     : 90%;
        height    : auto;
        margin: 45px auto 0;
        text-align: center;
    }
    #detail_navi a.oldPost,
    #detail_navi a.toList,
    #detail_navi a.newPost {
        display        : block;
        padding        : 7px 10px;
        border         : solid 1px #181818;
        text-align     : center;
        font-size      : 15px;
        line-height    : 15px;
        text-decoration: none;
        display: block;
        color: #FFF;
        background-color: #181818;
        transition: .3s;
    }
    #detail_navi a.oldPost {
        position: absolute;
        top: 0;
        left    : 0;
        width   : 20%;
    }
    #detail_navi a.toList {
        width : 35%;
        margin: 0 auto;
        color: #181818;
        background-color: #FFF;
    }
    #detail_navi a.newPost {
        position: absolute;
        top: 0;
        right   : 0;
        width   : 20%;
    }
    #detail_navi a.oldPost:hover,
    #detail_navi a.newPost:hover {
        color: #181818;
        background-color: #FFF;
    }
    #detail_navi a.toList:hover{
        color: #FFF;
        background-color: #181818;
    }
    .oldPost img,
    .toList img,
    .newPost img {
        width         : auto;
        height        : 10px;
        padding-bottom: 3px;
    }
    .oldPost img {
        padding-right: 8px;
    }
    .newPost img {
        padding-left: 8px;
    }
}

@media (max-width: 499px){
    #design {
        padding-top: 50px;
        padding-bottom: 0;
    }
    #design .bt-area-graphic {
        width: 300px;
        margin-top: 0px;
        margin-bottom: 50px;
    }
    #design ul.cat_box li {
        font-size: 12px;
    }
    #design .g_box .box .place div{
        width: 100%;
        font-size: 12px;
        color: #FFF;
        text-align: center;
        margin-top: 10px;
        padding-right: 5px;
        padding-left: 5px;
        float: none;
    }
    #design .g_box{
        width: 100%;
        margin-right: auto;
        margin-left: auto;
    }
    #design .g_box .box .new{
        left: 5px;
        width: 30px;
        height: 30px;
    }
    #design .g_box .box{
        flex: 0 0 49.999%;
        max-width: 49.999%;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 2.5em;
    }
    #design .g_box .box a{
        padding: 5px 5px 15px;
    }
    #design .g_box .box p {
        font-size: 12px;
    }
    #design .g_box .box .place {
        font-size: 10px;
    }
    #design .info {
        font-size: 18px;
    }
    #design .dataCover .data .left div{
        width: 25%;
    }
    #design .dataCover .data .left .con{
        width: 70%;
        padding-left: 0%;
    }
    #design .dataCover .data .label {
        left: 5px;
    }
    #detail_navi a.newPost {
        width: 30%;
    }
    #detail_navi a.oldPost {
        width: 30%;
    }
}



/*------------------------------------------------------------------
[Recruit Page]
*/

#recruit {
    width: 100%;
    padding-top: 70px;
    padding-bottom: 0px;
}

#guideline .tb {
    margin-bottom: 70px;
}

#guideline .bt_back {
    width: 280px;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 50px;
}

#guideline .bt_back a{
	font-size: 16px;
	font-weight: 500;
	padding-top: 8px;
	padding-bottom: 8px;
	background-color: #FFF;
	display: block;
	border: 1px solid #231F20;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

#guideline .bt_back a:hover{
	color: #FFF;
	background-color: #231F20;
}

@media (max-width: 499px){
    #recruit {
        padding-bottom: 40px;
    }
    #recruit p {
        font-size: 15px;
        line-height: 2.0;
        text-align: left;
        margin: 0px;
        padding: 0px 5%;
    }
    #recruit p br.br {
        display: none;
    }
    #guideline .tb th {
        display: block;
        width: 100%;
        text-align: left;
        padding-top: 1.5em;
        padding-left: 2%;
        padding-right: 2%;
    }
    #guideline .tb td {
        display: block;
        width: 100%;
        padding-top: 0;
        padding-left: 2%;
        padding-right: 2%;
        padding-bottom: 1.5em;
        border-left-width: 0px;
        border-bottom: solid 1px #111;
    }
}



/*------------------------------------------------------------------
[Contents]
*/

#cont{
	margin: 0 auto;
	padding: 0;
	width: 100%;
	position: relative;
}
#cont .catList{
	margin: 0 auto;
	padding: 35px 0;
	width: 100%;
	background-color: #edebe7;
	text-align: center;
}
#cont .catList ul.acc{
	display: block;
}
#cont .catList li{
	margin: 0;
	padding: 0;
	display: inline-block;
	font-size: 16px;
	line-height: 150%;
	text-align: center;
	font-weight: bold;
}
#cont .catList li+ li {
	border-left: 1px solid #333;
}
#cont .catList li a{
	padding: 10px 20px;
	transition: .3s;
}
#cont .catList li a:hover{
  opacity:0.5;
  filter: alpha(opacity=50);
}
#cont .catList div{
	display: none;
}

#cont .catTitle{
	margin: 0 auto;
	padding: 50px 0 0;
	width: 100%;
	font-size: 24px;
	text-align: center;
	font-weight: bold;
}

#cont .mainColumn{
	margin: 0 auto;
	padding: 60px 0 50px;
	width: 930px;
}
#cont .mainColumn ul {
    display: flex;
    flex-wrap: wrap;
}
#cont .mainColumn li{
    width: 33.333%;
    margin: 0;
    padding: 0 1% 40px;
}
#cont .mainColumn li .photo{
	width: 100%;
	height: auto;
	overflow: hidden;
}
#cont .mainColumn li .photo img{
	width: 100%;
	height: auto;
	transition: .3s;
}
#cont .mainColumn li .sub{
	margin: 0;
	padding: 8px 0 0;
	width: 100%;
	font-size: 12px;
	text-align: left;
	color: #888;
	font-weight: bold;
	transition: .3s;
}
#cont .mainColumn li .sub .cat{
	margin: 0;
	padding: 0 5px 0 0;
	width: auto;
}
#cont .mainColumn li .sub .date{
	margin: 0;
	padding: 0 0 0 5px;
	width: auto;
}
#cont .mainColumn li .title{
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 15px;
	text-align: left;
	line-height: 140%;
	font-weight: 500;
	transition: .3s;
}
#cont .mainColumn li a{
	width: 100%;
	height: auto;
	display: block;
	transition: .3s;
}
#cont .mainColumn li a:hover .photo img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}
#cont .mainColumn li a:hover .sub,
#cont .mainColumn li a:hover .title{
  opacity:0.4;
  filter: alpha(opacity=40);
}

#cont .mainColumn .info{
	font-size: 24px;
	line-height: 140%;
	font-weight: bold;
	padding-bottom: 10px;
	margin-top: 30px;
}
#cont .mainColumn .bt{
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	margin-bottom: 30px;
	position: relative;
	-webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
        filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
}
#cont .mainColumn .bt a{
	width: 480px;
	font-size: 18px;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #FFF;
	display: block;
	border: 1px solid #231F20;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
#cont .mainColumn .bt a.arrow{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	text-decoration: none;
	font-size: 18px;
}
#cont .mainColumn .bt a.arrow::before,
#cont .mainColumn .bt a.arrow::after{
position: absolute;
top: 0;
bottom: 0;
right: 0;
margin: auto;
content: "";
vertical-align: middle;
}
#cont .mainColumn .bt a.arrow::before{
right: 14px;
width: 15px;
height: 1px;
background: #231F20;
}
#cont .mainColumn .bt a.arrow::after{
right: 16px;
width: 6px;
height: 6px;
border-top: 1px solid #231F20;
border-right: 1px solid #231F20;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
#cont .mainColumn .bt a:hover{
	color: #FFF;
	background-color: #231F20;
}
#cont .mainColumn .bt a:hover::before{
	background: #FFF;
}
#cont .mainColumn .bt a.arrow:hover::after{
border-top: 1px solid #FFF;
border-right: 1px solid #FFF;
}


/* 詳細 */
#cont .leftColumn{
	float: none;
	margin: 0 auto;
	padding: 0 0 40px;
	width: 100%;
	text-align   : left;
}
#cont .leftColumn .catD{
	width        : 100%;
	padding      : 0 0 10px;
	font-size: 15px;
	line-height: 150%;
	font-weight: bold;
	text-align   : left;
	color        : #999;
}
#cont .leftColumn h2#postTitle {
	width        : 100%;
	padding      : 0 0 25px;
	font-size: 26px;
	line-height: 150%;
	text-align   : left;
	color        : #181818;
}
#cont .leftColumn .iCatch{
	margin: 0 auto;
	padding: 0;
	width: 100%;
}
#cont .leftColumn .iCatch img{
	width: 100%;
	height: auto;
}
#cont .leftColumn .innerBox {
	width       : 100%;
	height      : auto;
	margin      : 25px 0 50px;
	font-size   : 16px;
	line-height : 160%;
}

#cont .leftColumn .innerBox h3,
#cont .leftColumn .innerBox h4,
#cont .leftColumn .innerBox h5,
#cont .leftColumn .innerBox h6 {
	font-weight   : bold;
	color         : #181818;
	line-height   : 1.35;
	letter-spacing: normal;
	text-align    : left;
}
#cont .leftColumn .innerBox h3 {
	width         : 100%;
	margin-top    : 35px;
	margin-bottom : 15px;
	padding-bottom: 6px;
	border-bottom : solid 2px #181818;
	font-size     : 20px;
}
#cont .leftColumn .innerBox h4 {
	background-repeat: repeat-y;
	background-position: left 9px;
	background-image: url(../images/h4_mark.gif);
	margin-top    : 35px;
	margin-bottom : 15px;
	padding-left  : 15px;
	padding-bottom: 0;
	font-size     : 20px;
	border-bottom : none;
}
#cont .leftColumn .innerBox h5 {
	background-repeat: no-repeat;
	background-position: left 7px;
	background-image: url(../images/h5_mark.gif);
	padding-left : 15px;
	margin-top   : 35px;
	margin-bottom: 15px;
	font-size    : 18px;
}
#cont .leftColumn .innerBox h6 {
	margin-top   : 25px;
	margin-bottom: 10px;
	font-size    : 16px;
}
#cont .leftColumn .innerBox p {
	margin-top: 10px;
	font-size   : 16px;
	line-height : 160%;
}
#cont .leftColumn .innerBox p a{
	color: #2aaae2;
	text-decoration: underline;
	transition: .3s;
}
#cont .leftColumn .innerBox p a:hover{
  opacity:0.3;
  filter: alpha(opacity=30);
}
#cont .leftColumn .innerBox img {
	display   : inline-block;
	max-width : 100%;
	min-width : 45%;
	width     : auto;
	height    : auto;
	margin-top: 20px;
}
#cont .leftColumn .innerBox .wp-caption-text {
	margin-top   : 10px;
	margin-bottom: 25px;
	color        : #666;
	font-size    : 14px;
	line-height  : 160%;
}

#detail_navi {
    position: relative;
    width: 90%;
    height: auto;
    margin: 65px auto 0;
    text-align: center;
}
#detail_navi a.oldPost,
#detail_navi a.toList,
#detail_navi a.newPost {
	display        : block;
    padding        : 7px 10px;
    border         : solid 1px #181818;
	text-align     : center;
    font-size      : 16px;
	line-height    : 16px;
    text-decoration: none;
	display: block;
	color: #FFF;
	background-color: #181818;
	transition: .3s;
}
#detail_navi a.oldPost {
	position: absolute;
	top: 0;
	left    : 0;
	width   : 80px;
}
#detail_navi a.toList {
	width : 160px;
	margin: 0 auto;
	color: #181818;
	background-color: #FFF;
}
#detail_navi a.newPost {
	position: absolute;
	top: 0;
	right   : 0;
	width   : 80px;
}
#detail_navi a.oldPost:hover,
#detail_navi a.newPost:hover {
	color: #181818;
	background-color: #FFF;
}
#detail_navi a.toList:hover{
	color: #FFF;
	background-color: #181818;
}
.oldPost img,
.toList img,
.newPost img {
	width         : auto;
	height        : 10px;
	padding-bottom: 3px;
}
.oldPost img {
	padding-right: 8px;
}
.newPost img {
	padding-left: 8px;
}


@media (max-width: 1480px){
    #detail_navi {
        width: 80%;
        margin: 65px auto 0;
    }
}


/* SP */
@media screen and (max-width: 1200px){
    
    #cont{
        margin: 0 auto;
        padding: 0;
        width: 100%;
        position: relative;
    }
    #cont .catList{
        margin: 0 auto;
        padding: 0;
        width: 100%;
        background-color: #edebe7;
        text-align: center;
    }
    #cont .catList ul.acc{
        display: none;
    }
    #cont .catList li{
        margin: 0;
        padding: 0;
        display: block;
        font-size: 100%;
        line-height: 100%;
        text-align: center;
        font-weight: bold;
        border-bottom: 1px solid #999;
    }
    #cont .catList li:first-child{
        border-top: 1px solid #999;
    }
    #cont .catList li+ li {
        border-left: none;
    }
    #cont .catList li a{
        display: block;
        padding: 1.5em 0;
        transition: .3s;
    }
    #cont .catList li a:hover{
        opacity:0.5;
        filter: alpha(opacity=50);
    }
    
    #cont .catList div{
        margin: 0;
        padding: 1.5em 0;
        display: block;
        font-size: 120%;
        line-height: 100%;
        text-align: center;
        color: #000;
        font-weight: bold;
        text-indent: 35px;
    }
    #cont .catList .accordion_icon,
    #cont .catList .accordion_icon span {
        display: inline-block;
        transition: all .4s;
        box-sizing: border-box;
    }
    #cont .catList .accordion_icon {
        margin: 0 0 0;
        position: relative;
        width: 35px;
        height: 30px;
        float: right;
    }
    #cont .catList .accordion_icon span {
        position: absolute;
        left: 6px;
        width: 50%;
        height: 3px;
        background-color: #000;
    }
    #cont .catList .accordion_icon span:nth-of-type(1) {
        top: 5px;
        transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
    }
    #cont .catList .accordion_icon span:nth-of-type(2) {
        top: 5px;
        transform: rotate(90deg);
        -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        -o-transform: rotate(90deg);
    }
    /*＋、－切り替え*/
    #cont .catList .accordion_icon.active span:nth-of-type(1) {
        display:none;
    }
    #cont .catList .accordion_icon.active span:nth-of-type(2) {
        top: 5px;
        transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
    }
    
    #cont .catTitle{
        margin: 0 auto;
        padding: 2em 0 0;
        width: 100%;
        font-size: 170%;
        text-align: center;
        font-weight: bold;
    }
    
    #cont .mainColumn{
        margin: 0 auto;
        padding: 3em 0 2em;
        width: 90%;
    }
    #cont .mainColumn li{
        float: none;
        margin: 0;
        padding: 0 1% 30px;
        width: 49.9%;
        height: auto;
    }
    #cont .mainColumn li:nth-child(3n){
        margin: 0;
    }
    #cont .mainColumn li .photo{
        width: 100%;
        height: auto;
        overflow: hidden;
    }
    #cont .mainColumn li .photo img{
        width: 100%;
        height: auto;
        transition: .3s;
    }
    #cont .mainColumn li .sub{
        margin: 0;
        padding: 8px 0 0;
        width: 100%;
        font-size: 12px;
        text-align: left;
        color: #888;
        font-weight: bold;
        transition: .3s;
    }
    #cont .mainColumn li .sub .cat{
        margin: 0;
        padding: 0 5px 0 0;
        width: auto;
    }
    #cont .mainColumn li .sub .date{
        margin: 0;
        padding: 0 0 0 5px;
        width: auto;
    }
    #cont .mainColumn li .title{
        margin: 0;
        padding: 0;
        width: 100%;
        font-size: 14px;
        text-align: left;
        line-height: 140%;
        font-weight: bold;
        transition: .3s;
    }
    #cont .mainColumn li a{
        width: 100%;
        height: auto;
        display: block;
        transition: .3s;
    }
    #cont .mainColumn li a:hover .photo img {
        -webkit-transform: scale(1.2);
        -moz-transform: scale(1.2);
        -o-transform: scale(1.2);
        -ms-transform: scale(1.2);
        transform: scale(1.2);
    }
    #cont .mainColumn li a:hover .sub,
    #cont .mainColumn li a:hover .title{
        opacity:0.4;
        filter: alpha(opacity=40);
    }
    
    
    #cont .mainColumn .info{
        width: 90%;
        margin-right: auto;
        margin-left: auto;
        font-size: 140%;
        line-height: 140%;
        font-weight: bold;
        padding-bottom: 0;
        margin-top: 1em;
    }
    
    #cont .mainColumn .bt{
        margin-right: auto;
        margin-left: auto;
        margin-top: 1em;
        margin-bottom: 1em;
        position: relative;
        -webkit-filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
            filter: drop-shadow(2px 2px 2px rgba(0,0,0,.3));
    }
    #cont .mainColumn .bt a{
        width: 90%;
        padding-top: 20px;
        padding-bottom: 20px;
        background-color: #FFF;
        display: block;
        border: 1px solid #231F20;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }
    #cont .mainColumn .bt a.arrow{
        position: relative;
        display: inline-block;
        vertical-align: middle;
        text-decoration: none;
        font-size: 4.8vw;
    }
    #cont .mainColumn .bt a.arrow::before,
    #cont .mainColumn .bt a.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
    }
    #cont .mainColumn .bt a.arrow::before{
    right: 14px;
    width: 15px;
    height: 1px;
    background: #231F20;
    }
    #cont .mainColumn .bt a.arrow::after{
    right: 16px;
    width: 6px;
    height: 6px;
    border-top: 1px solid #231F20;
    border-right: 1px solid #231F20;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    }
    #cont .mainColumn .bt a:hover{
        color: #FFF;
        background-color: #231F20;
    }
    #cont .mainColumn .bt a:hover::before{
        background: #FFF;
    }
    #cont .mainColumn .bt a.arrow:hover::after{
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    }
    
    /* 詳細 */
    #cont .leftColumn{
        float: none;
        margin: 0 auto;
        padding: 0 0 2em;
        width: 100%;
    }
    #cont .leftColumn .catD{
        width        : 100%;
        padding      : 0 0 10px;
        font-size: 110%;
        line-height: 150%;
        font-weight: bold;
        text-align   : left;
        color        : #999;
    }
    #cont .leftColumn h2#postTitle {
        width        : 100%;
        padding      : 0 0 1em;
        font-size: 150%;
        line-height: 150%;
        text-align   : left;
        color        : #181818;
    }
    #cont .leftColumn .iCatch{
        margin: 0 auto;
        padding: 0;
        width: 100%;
    }
    #cont .leftColumn .iCatch img{
        width: 100%;
        height: auto;
    }
    #cont .leftColumn .innerBox {
        width       : 100%;
        height      : auto;
        margin      : 25px 0 50px;
        font-size   : 100%;
        line-height : 160%;
    }
    
    #cont .leftColumn .innerBox h3,
    #cont .leftColumn .innerBox h4,
    #cont .leftColumn .innerBox h5,
    #cont .leftColumn .innerBox h6 {
        font-weight   : bold;
        color         : #181818;
        line-height   : 1.35;
        letter-spacing: normal;
        text-align    : left;
    }
    #cont .leftColumn .innerBox h3 {
        width         : 100%;
        margin-top    : 35px;
        margin-bottom : 1em;
        padding-bottom: 6px;
        border-bottom : solid 2px #181818;
        font-size     : 140%;
    }
    #cont .leftColumn .innerBox h4 {
        background-repeat: repeat-y;
        background-position: left 9px;
        background-image: url(../images/h4_mark.gif);
        margin-top    : 35px;
        margin-bottom : 1em;
        padding-left  : 15px;
        padding-bottom: 0;
        font-size     : 135%;
        border-bottom : none;
    }
    #cont .leftColumn .innerBox h5 {
        background-repeat: no-repeat;
        background-position: left 7px;
        background-image: url(../images/h5_mark.gif);
        padding-left : 15px;
        margin-top   : 35px;
        margin-bottom: 1em;
        font-size    : 130%;
    }
    #cont .leftColumn .innerBox h6 {
        margin-top   : 25px;
        margin-bottom: 10px;
        font-size    : 110%;
    }
    #cont .leftColumn .innerBox p {
        margin-top: 10px;
        font-size   : 16px;
        line-height : 160%;
    }
    #cont .leftColumn .innerBox img {
        display   : inline-block;
        max-width : 100%;
        min-width : 45%;
        width     : auto;
        height    : auto;
        margin-top: 20px;
    }
    #cont .leftColumn .innerBox .wp-caption-text {
        margin-top   : 10px;
        margin-bottom: 25px;
        color        : #666;
        font-size    : 14px;
        line-height  : 160%;
    }
    
    #detail_navi {
        position  : relative;
        width     : 100%;
        height    : auto;
        margin-top: 25px;
        text-align: center;
    }
    #detail_navi a.oldPost,
    #detail_navi a.toList,
    #detail_navi a.newPost {
        display        : block;
        padding        : 7px 10px;
        border         : solid 1px #181818;
        text-align     : center;
        font-size      : 16px;
        line-height    : 16px;
        text-decoration: none;
        display: block;
        color: #FFF;
        background-color: #181818;
        transition: .3s;
    }
    #detail_navi a.oldPost {
        position: absolute;
        top: 0;
        left    : 0;
        width   : 30%;
    }
    #detail_navi a.toList {
        width : 35%;
        margin: 0 auto;
        color: #181818;
        background-color: #FFF;
    }
    #detail_navi a.newPost {
        position: absolute;
        top: 0;
        right   : 0;
        width   : 30%;
    }
    #detail_navi a.oldPost:hover,
    #detail_navi a.newPost:hover {
        color: #181818;
        background-color: #FFF;
    }
    #detail_navi a.toList:hover{
        color: #FFF;
        background-color: #181818;
    }
    .oldPost img,
    .toList img,
    .newPost img {
        width         : auto;
        height        : 10px;
        padding-bottom: 3px;
    }
    .oldPost img {
        padding-right: 8px;
    }
    .newPost img {
        padding-left: 8px;
    }
}
@media screen and (max-width: 499px) {
    #cont .mainColumn {
        padding: 3em 0 2em;
        width: 95%;
    }
    #cont .mainColumn li {
        padding: 0 5px 30px;
        width: 49.999%;
        height: auto;
    }
}




/*------------------------------------------------------------------
[Staff Page]
*/

.second-content-section {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 15px;
    background-color: #FFF;
}

#staff .blBox {
    margin: 0 auto;
    padding: 0 0 100px;
    width: 100%;
    position: relative;
}

#staff ul.cover {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 50px;
    text-align: center;
}

#staff ul.cover li {
    float: none;
    padding: 12px 0 0;
    width: 22%;
    height: auto;
    margin-left: 1.5%;
    margin-right: 1.5%;
    position: relative;
}

#staff ul.cover li:nth-child(4n) {
    margin-right: 1.5%;
}

#staff ul.cover li .photo {
    width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    background-color: #FFF;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}