.s-Name {
    -ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
    position: absolute;
    top: 0;
    right: 0;
}

.s-Name::after {
    content: "";
    display: block;
    width: 1px;
    height: calc(100% + 100px);
    background-color: #b5b5b5;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 0;
}

.s-Name span {
    font-size: 42px;
	color: #b5b5b5;
    background-color: #ffffff;
    padding-bottom: 20px;
    margin-right: 20px;
    position: relative;
    z-index: 1;
}

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

    .s-Name span {
        font-size: 28px;
    }

}


/*==========

about

==========*/

.about {
    margin-bottom: 160px;
}

.about .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.about .page-Ttl span {
    display: block;
	font-size: 68px;
    color: #a59b93;
}

/*===== lambertye-Col =====*/

.about .lambertye-Col {
    padding-bottom: 100px;
    margin-bottom: 100px;
    border-bottom: 1px solid #e2dcd7;
}

.about .lambertye-Col .ttl {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 40px;
}

.about .lambertye-Col .sub-Ttl {
    font-size: 22px;
    text-align: center;
}

.about .lambertye-Col .m-Txt {
    text-align: center;
    font-size: 18px;
    margin-top: 30px;
    margin-bottom: 40px;
}

.about .lambertye-Col .txt {
    text-align: center;
    line-height: 2;
    margin-top: 20px;
}


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

    .about .lambertye-Col .ttl {
        margin-bottom: 30px;
    }

}

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

    .about .lambertye-Col .m-Txt {
        text-align: left;
    }

    .about .lambertye-Col .txt {
        text-align: left;
    }

}


/*===== management-Col =====*/

.about .management-Col {
    padding-bottom: 100px;
    margin-bottom: 100px;
    border-bottom: 1px solid #e2dcd7;
}

.about .management-Col .ttl {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 60px;
}

.about .management-Col .ttl span {
    display: block;
    font-size: 14px;
    font-weight: normal;
}

.about .management-Col .txt-Box dt {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 60px;
}

.about .management-Col .txt-Box dd {
    text-align: center;
    line-height: 2;
}

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

    .about .management-Col .ttl {
        margin-bottom: 30px;
    }

    .about .management-Col .txt-Box dt {
        margin-bottom: 30px;
    }

}

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

    .about .management-Col .txt-Box dt {
        font-size: 22px;
        text-align: left;
    }

    .about .management-Col .txt-Box dd {
        text-align: left;
    }

}



/*===== profile-Col =====*/

.about .profile-Col {
    margin-bottom: 120px;
}

.about .profile-Col .inner {
    max-width: 1024px;
    margin: 0 auto;
}

.about .profile-Col .ttl {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 60px;
}

.about .profile-Col .box .image {
    float: left;
    width: 340px;
    height: 418px;
    overflow: hidden;
}

.about .profile-Col .box .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.about .profile-Col .box .right-Col {
    float: right;
    width: calc(100% - 380px);
}

.about .profile-Col .box .right-Col .name-Txt {
    font-size: 28px;
    font-weight: bold;
    margin-bottom: 10px;
}

.about .profile-Col .box .right-Col .name-Txt span {
    font-size: 14px;
    font-weight: normal;
    padding-left: 10px;
}

.about .profile-Col .box .right-Col .position {
    font-size: 14px;
    color: #3b3b3b;
    margin-bottom: 20px;
}

.about .profile-Col .box .right-Col .sns-Col {
    display: flex;
    margin-bottom: 30px;
}

.about .profile-Col .box .right-Col .sns-Col figure {
    padding-right: 10px;
    box-sizing: border-box;
}

.about .profile-Col .box .right-Col .sns-Col figure img {
    width: auto;
    height: 20px;
}

.about .profile-Col .box .right-Col .txt-Box p {
    line-height: 2;
}

.about .profile-Col .box .right-Col .txt-Box p + p {
    margin-top: 20px;
}

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

    .about .page-Ttl span {
        font-size: 38px;
    }

    .about .profile-Col .ttl {
        margin-bottom: 30px;
    }

}

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

    .about .page-Ttl span {
        font-size: 34px;
    }

    .about .profile-Col .box .image {
        width: 100%;
        height: 320px;
        margin-bottom: 20px;
    }

    .about .profile-Col .box .image img {
        object-position: 0 -10px;
    }

    .about .profile-Col .box .right-Col {
        width: 100%;
    }    

}

/*===== yearbook-Col =====*/

.yearbook-Col {
    padding-bottom: 120px;
    margin-bottom: 120px;
    border-bottom: 1px solid #e2dcd7;
}

.yearbook-Col .inner {
    max-width: 1024px;
    margin: 0 auto;
}

.yearbook-Col .ttl {
    max-width: 240px;
    text-align: center;
    padding: 10px 0;
    margin: 0 auto 40px;
    border: 1px solid #5a5a5a;
}

.yearbook-Col .box dl {
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
}

.yearbook-Col .box dl:nth-child(1){
    margin-top: 0;
}

.yearbook-Col .box dl dt {
    width: 70px;
}

.yearbook-Col .box dl dd {
    width: calc(100% - 70px);
}

.yearbook-Col .box dl.one-Col dd {
    position: relative;
}

.yearbook-Col .box dl.one-Col dd::before {
    content: "";
    display: block;
    width: calc(100% + 70px);
    height: 1px;
    background-color: #e2dcd7;
    position: absolute;
    left: -70px;
    bottom: -15px;
}

.yearbook-Col .box dl dd div {
    margin-top: 30px;
    position: relative;
}

.yearbook-Col .box dl dd div:nth-child(1) {
    margin-top: 0;
}

.yearbook-Col .box dl dd div::before {
    content: "";
    display: block;
    width: calc(100% + 70px);
    height: 1px;
    background-color: #e2dcd7;
    position: absolute;
    left: -70px;
    bottom: -15px;
}

.yearbook-Col .box dl:last-child dd div:last-child::before {
    content: none;
}


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

    .yearbook-Col .box dl dt {
        width: 60px;
    }

    .yearbook-Col .box dl dd {
        width: calc(100% - 60px);
    }

    .yearbook-Col .box dl:nth-child(1) dd::before,
    .yearbook-Col .box dl:nth-child(2) dd::before {
        width: calc(100% + 60px);
        left: -60px;
    }

    .yearbook-Col .box dl dd div::before {
        width: calc(100% + 60px);
        left: -60px;
    }    

}



/*===== businessname-Col =====*/

.businessname-Col {
    padding-bottom: 120px;
    margin-bottom: 120px;
    border-bottom: 1px solid #e2dcd7;
}

.businessname-Col .ttl {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 60px;
}

.businessname-Col .ttl span {
    display: block;
    font-size: 14px;
    font-weight: normal;
}

.businessname-Col h4 {
    font-size: 28px;
    text-align: center;
    margin-bottom: 40px;
}

.businessname-Col .txt-Box p {
    font-size: 15px;
    text-align: center;
    line-height: 2;
}

.businessname-Col .txt-Box p + p {
    margin-top: 20px;
}

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

    .businessname-Col .ttl {
        margin-bottom: 30px;
    }

    .businessname-Col h4 {
        margin-bottom: 20px;
    }

}

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

    .businessname-Col h4 {
        font-size: 24px;
    }

    .businessname-Col .txt-Box p {
        text-align: left;
    }

}


/*===== logomark-Col =====*/

.logomark-Col .ttl {
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 60px;
}

.logomark-Col .ttl span {
    display: block;
    font-size: 14px;
    font-weight: normal;
}

.logomark-Col .image {
    max-width: 140px;
    margin: 0 auto 40px;
}

.logomark-Col .image img {
    width: 100%;
    height: auto;
}

.logomark-Col .txt-Box p {
    line-height: 2;
    text-align: center;
}

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

    .logomark-Col .ttl {
        margin-bottom: 30px;
    }

}

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

    .logomark-Col .txt-Box p {
        text-align: left;
    }

}

/*==========

service

==========*/

.service {
    margin-bottom: 160px;
}

/*===== overview =====*/

.service .overview {
    margin-bottom: 100px;
}

.service .overview .txt-Box {
    margin-bottom: 60px;
}

.service .overview .txt-Box .ttl {
    font-size: 15px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.service .overview .txt-Box .ttl span {
    display: block;
	font-size: 68px;
    color: #a59b93;
}

.service .overview .image {
    max-width: 960px;
    margin: 0 auto;
}

.service .overview .image img {
    width: 100%;
}

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

    .service .overview .txt-Box .ttl span {
        font-size: 38px;
    }

}

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

    .service .overview .txt-Box .ttl {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .service .overview .txt-Box .ttl span {
        font-size: 24px;
    }

}


/*===== production =====*/

.production {
    padding-top: 80px;
    margin-top: -80px;
    margin-bottom: 100px;
}

.production:last-child {
    margin-bottom: 0;
}

.production .no {
    color: #e2dcd7;
    font-size: 50px;
    font-weight: bold;
    line-height: 1;
}

.production .unit {
    margin-bottom: 40px;
    position: relative;
}

.production .bg-Image {
    display: block;
    width: 50%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #888888;
    position: absolute;
    top: 0;
    right: 0;
}

#dacp.production .bg-Image {
    background-image: url(../images/toppage/design_image.jpg);
}

#ip.production .bg-Image {
    background-image: url(../images/toppage/illustration_image.jpg);
}

#aad.production .bg-Image {
    background-image: url(../images/toppage/architectural_image.jpg);
}

#ed.production .bg-Image {
    background-image: url(../images/toppage/enviroment_image.jpg);
}

#tafd.production .bg-Image {
    background-image: url(../images/toppage/textile_image.jpg);
}

.production .left-Box {
    width: 50%;
    background-color: #e2dcd7;
    padding: 60px 40px;
    box-sizing: border-box;
}

.production .left-Box dt {
    font-size: 15px;
    margin-bottom: 20px;
}

.production .left-Box dt span {
    display: block;
    font-size: 28px;
}

.production .list {
    margin-bottom: 20px;
}

.production .list .item {
    padding: 10px 20px 10px 30px;
    border-bottom: 1px solid #bdbdbd;
    box-sizing: border-box;
    position: relative;
}

.production .list .item::before {
    content: "\02022";
    position: absolute;
    top: 10px;
    left: 15px;
}

.production .cap span {
    display: block;
    max-width: 680px;
    font-size: 14px;
    position: relative;
    margin-left: auto;
    padding-left: 20px;
}

.production .cap span::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 0;
}

.production .btn a {
    display: block;
    max-width: 320px;
    text-align: center;
    color: #ffffff;
    background-color: #22283e;
    border: 1px solid #22283e;
    padding: 20px 0;
    margin: 30px auto 0;
    transition: .6s all;
}

.production .btn a:hover {
    color: #22283e;
    background-color: #ffffff;
}


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

    .production .unit {
        margin-bottom: 20px;
        position: relative;
    }

    .production .left-Box {
        padding: 40px 20px;
    }

    .production .left-Box dt {
        font-size: 14px;
    }

    .production .left-Box dt span {
        font-size: 22px;
    }
    
}

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

    .production {
        padding-top: 60px;
        margin-top: -60px;
    }

    .production .no {
        font-size: 45px;
    }

    .production .left-Box {
        width: 100%;
        padding: 30px 20px;
    }

    .production .bg-Image {
        width: 100%;
        height: auto;
        background-color: #888888;
        position: static;
    }

    .production .bg-Image::before {
        content: "";
        display: block;
        padding-top: 60%;
    }

}


/*==========

service-View

==========*/

.service-View {
    margin-bottom: 160px;
}

.service-View .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.service-View .page-Ttl span {
    display: block;
    font-size: 46px;
}

.service-View .txt-Col {
    margin-bottom: 140px;
}

.service-View .top-Txt p,
.service-View .bottom-Txt p {
    line-height: 2;
}

/*===== top-Txt =====*/

.service-View .top-Txt {
    margin-bottom: 100px;
}

.service-View .top-Txt .ttl {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 20px;
}

.service-View .top-Txt .bg-Image {
    width: 100%;
    background-size: cover;
    background-position: center;
    background-color: #888888;
    margin-bottom: 60px;
}

.service-View .top-Txt .bg-Image::before {
    content: "";
    display: block;
    padding-top: 60%;
}

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

    .service-View .page-Ttl span {
        font-size: 38px;
    }

    .service-View .top-Txt {
        margin-bottom: 60px;
    }

}

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

    .service-View .page-Ttl {
        margin-bottom: 20px;
    }

    .service-View .page-Ttl span {
        font-size: 28px;
    }

    .service-View .top-Txt {
        margin-bottom: 40px;
    }

    .service-View .top-Txt .ttl {
        font-size: 24px;
        margin-bottom: 10px;
    }

    .service-View .top-Txt .bg-Image {
        margin-bottom: 40px;
    }

}


/*===== bottom-Txt =====*/

.service-View .bottom-Txt {
    margin-bottom: 100px;
}

.service-View .bottom-Txt .list {
    display: flex;
    margin-bottom: 60px;
}

.service-View .bottom-Txt .list .item {
    margin-right: 10px;
}

.service-View .bottom-Txt .list .item:nth-child(2n) {
    margin-top: 60px;
}

.service-View .bottom-Txt .list .item:last-child {
    margin-right: 0;
}

.service-View .bottom-Txt .list .item figure {
    font-size: 0;
}

.service-View .bottom-Txt .list .item figure img {
    width: 100%;
}

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

    .service-View .bottom-Txt .list {
        flex-wrap: wrap;
    }

    .service-View .bottom-Txt .list .item {
        width: calc(50% - 5px);
        margin-top: 10px;
        margin-right: 10px;
    }

    .service-View .bottom-Txt .list .item:nth-child(1),
    .service-View .bottom-Txt .list .item:nth-child(2) {
        margin-top: 0;
    }

    .service-View .bottom-Txt .list .item:nth-child(2n) {
        margin-right: 0;
    }

    .service-View .bottom-Txt .list .item:last-child {
        margin-top: 10px;
    }

}

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

    .service-View .bottom-Txt {
        margin-bottom: 80px;
    }

    .service-View .bottom-Txt .list {
        margin-bottom: 40px;
    }

}


/*===== btn-Box =====*/

.service-View .btn-Box .w-Btn {
    margin-bottom: 20px;
}

.service-View .btn-Box .w-Btn a {
    display: block;
    max-width: 520px;
    text-align: center;
    padding: 15px 0;
    margin: 0 auto;
    border: 1px solid #3b3b3b;
    box-sizing: border-box;
}

.service-View .btn-Box .c-Btn {
    margin-bottom: 10px;
}

.service-View .btn-Box .c-Btn a {
    display: block;
    max-width: 520px;
    text-align: center;
    padding: 15px 0;
    margin: 0 auto;
    border: 1px solid #3b3b3b;
    box-sizing: border-box;
}

.service-View .btn-Box .f-Btn {
    text-align: center;
}

.service-View .btn-Box .f-Btn a {
    text-decoration: underline;
}

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

    .service-View .txt-Col {
        margin-bottom: 100px;
    }

}


/*===== scl-Navigation =====*/

.scl-Navigation .ttl {
    font-size: 14px;
    line-height: 1.2;
    margin-bottom: 30px;
}

.scl-Navigation .ttl span {
    display: block;
    font-size: 28px;
}

.scl-Navigation ul li {
    float: left;
    width: calc(50% - 10px);
    margin-top: 30px;
}

.scl-Navigation ul li:nth-child(1),
.scl-Navigation ul li:nth-child(2) {
    margin-top: 0;
}

.scl-Navigation ul li:nth-child(2n) {
    float: right
}

.scl-Navigation ul li a {
    display: block;
    font-size: 15px;
    line-height: 1.4;
    padding: 20px;
    border-bottom: 1px solid #333333;
    box-sizing: border-box;
    position: relative;
}

.scl-Navigation ul li a::after {
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    border-top: 1px solid #333333;
    border-right: 1px solid #333333;
    position: absolute;
    top: 0;
    right: 20px;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
}

.scl-Navigation ul li a span {
    display: block;
    font-size: 20px;
}

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

    .scl-Navigation ul li a {
        font-size: 14px;
    }

    .scl-Navigation ul li a span {
        font-size: 18px;
    }

}

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

    .scl-Navigation ul li {
        width: 100%;
        margin-top: 20px;
    }

    .scl-Navigation ul li:nth-child(2) {
        margin-top: 20px;
    }

    .scl-Navigation ul li a {
        padding: 20px 10px;
    }

    .scl-Navigation ul li a::after {
        width: 10px;
        height: 10px;
        right: 10px;
    }

}


/*==========

works

==========*/

.works {
    margin-bottom: 160px;
}

.works .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.works .page-Ttl span {
    display: block;
	font-size: 68px;
    color: #a59b93;
}

.works .page-Ttl span.ly-txt {
	font-size: 48px;
}

.works .cat-Nav {
    margin-bottom: 40px;
}

.works .cat-Nav.ly-Low {
    margin-top: 50px;
    margin-bottom: 0;
}

.works .cat-Nav ul li {
    display: inline-block;
    font-size: 18px;
    color: #333333;
    padding-right: 20px;
    margin-bottom: 20px;
}

.works .cat-Nav.ly-Low ul li {
    margin-top: 20px;
    margin-bottom: 0;
}

.works .cat-Nav ul li a {
    font-size: 15px;
    color: #a1a1a1;
}

.works .cat-Nav ul li.now a {
	color: #333333;
	text-decoration: underline;
}

.works .cat-Nav ul li a:hover {
    color: #333333;
    text-decoration: underline;
}

.works .list {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 60px;
}

.works .list .item {
    width: calc(100% / 3 - 7px);
    margin-top: 40px;
    margin-right: 10px;
}

.works .list .item:nth-child(1),
.works .list .item:nth-child(2),
.works .list .item:nth-child(3) {
    margin-top: 0;
}

.works .list .item:nth-child(3n) {
    margin-right: 0;
}

.works .list .item a .mask {
    position: relative;
    display: block;
    line-height: 0;
    overflow: hidden;
}

.works .list .item .bg-Image {
    width: 100%;
    background-color: #888888;
    background-size: cover;
    background-position: center center;
    margin-bottom: 10px;
    border: 1px solid #e5e5e5;
	box-sizing: border-box;
}

.works .list .item a .mask::after {
    content: "";
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    opacity: 0;
    transition: .3s all;
    transform: translateY(100%);
    background: rgba(82, 82, 82, 0.7);
    width: 100%;
    height: 100%;
}

.works .list .item a:hover .mask::after {
    opacity: 1;
    transform: translateY(0);
}

.works .list .item .bg-Image::before {
    content: "";
    display: block;
    padding-top: 60%;
}

.works .list .item a .bg-Image span.cap {
    font-size: 18px;
    position: absolute;
    opacity: 0;
    transition: .5s all;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
}

.works .list .item a:hover .bg-Image .cap {
    opacity: 1;
}

.works .list .item h3 {
    color: #424242;
    font-size: 12px;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    margin-bottom: 3px;
}

.works .list .item h3.el-Txt {
    font-weight: bold;
}

.works .list .item a:hover h3 {
    text-decoration: underline;
}

.works .list .item .c-Txt {
    font-size: 12px;
    font-weight: bold;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    color: #5A5A5A;
    margin-bottom: 3px;
}

.works .list .item a:hover .c-Txt {
    text-decoration: underline;
}

.works .list .item .cat {
    font-size: 12px;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    color: #5A5A5A;
}

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

    .works .page-Ttl span {
        font-size: 28px;
    }

    .works .page-Ttl span.ly-txt {
        font-size: 34px;
    }

}

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

    .works {
        margin-bottom: 140px;
    }

    .works .page-Ttl {
        margin-bottom: 40px;
    }

    .works .page-Ttl span {
        font-size: 34px;
    }

    .works .page-Ttl span.ly-txt {
        font-size: 28px;
    }

    .works .list .item {
        width: 100%;
        margin-right: 0;
    }

    .works .list .item:nth-child(2),
    .works .list .item:nth-child(3) {
        margin-top: 40px;
    }

    .works .list .item:nth-child(3n) {
        margin-right: 0;
    }

    .works .list .item:nth-child(2n) {
        margin-right: 0;
    }

    .s-Name {
        -ms-writing-mode: tb-rl;
        writing-mode: vertical-rl;
        position: absolute;
        top: 0;
        right: 0;
    }

    .s-Name::after {
        content: "";
        display: block;
        width: 1px;
        height: calc(100% + 100px);
        background-color: #b5b5b5;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        margin: auto;
        z-index: 0;
    }

    .s-Name span {
        font-size: 42px;
        color: #b5b5b5;
        background-color: #ffffff;
        padding-bottom: 20px;
        margin-right: 20px;
        position: relative;
        z-index: 1;
    }

}

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

    .s-Name span {
        font-size: 28px;
    }

}


/*==========

flow

==========*/

.flow {
    margin-bottom: 160px;
}

.flow .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.flow .page-Ttl span {
    display: block;
    font-size: 68px;
    color: #a59b93;
}

.flow .overview-Txt {
    margin-bottom: 60px;
}

.flow .list .item {
    padding-left: 120px;
    position: relative;
}

.flow .list .item.no3::before,
.flow .list .item.no5::before,
.flow .list .item.no8::before {
    content: "";
    width: 100%;
    height: 2px;
    background-color: #22283e;
    position: absolute;
    top: -70px;
    left: 0;
}

.flow .list .item + .item {
    margin-top: 140px;
}

.flow .list .item .num {
    display: flex;
    width: 80px;
    height: 80px;
    font-size: 20px;
    font-weight: bold;
    color: #22283e;
    background-color: #e0dbd6;
    text-align: center;
    line-height: 1.2;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item .num::after {
    content: "";
    display: block;
    width: 15px;
    height: 15px;
    border-left: 2px solid #22283e;
    border-bottom: 2px solid #22283e;
    position: absolute;
    right: 0;
    left: 0;
    bottom: -25px;
    margin: auto;
    transform: rotate(-45deg);
}

.flow .list .item.no8 .num::after {
    content: none;
}

.flow .list .item .f-Ttl {
    width: 70%;
    float: left;
    color: #22283e;
    font-size: 24px;
    font-weight: bold;
    padding-top: 25px;
    margin-bottom: 30px;
}

.flow .list .item .f-Ttl span {
    color: #000000;
    font-size: 15px;
    font-weight: normal;
    padding-left: 10px;
}

.flow .list .item .image {
    width: calc(30% - 40px);
    float: right;
}

.flow .list .item .image img {
    width: 100%;
    height: auto;
}

.flow .list .item .txt {
    width: 70%;
    float: left;
}

.flow .list .item.no1 .box {
    margin-top: 60px;
}

.flow .list .item.no1 .box h3 {
    font-size: 20px;
    font-weight: bold;
    padding-left: 25px;
    margin-bottom: 30px;
    position: relative;
}

.flow .list .item.no1 .box h3::after {
    content: "\025c6";
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no1 .box h3 span {
    display: block;
    font-size: 15px;
    font-weight: normal;
    padding-left: 20px;
    margin-top: 10px;
    position: relative;
}

.flow .list .item.no1 .box h3 span::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no1 .box .unit {
    margin-bottom: 60px;
}

.flow .list .item.no1 .box .unit .inner {
    background-color: #f7f7f7;
    padding: 40px 30px;
}

.flow .list .item.no1 .box .unit dl + dl {
    margin-top: 40px;
}

.flow .list .item.no1 .box .unit dl dt {
    font-size: 18px;
    font-weight: bold;
    padding-left: 20px;
    margin-bottom: 10px;
    position: relative;
}

.flow .list .item.no1 .box .unit dl dt::before {
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no1 .box .unit dl.col-1 dt::before {
    content: "\02460";
}

.flow .list .item.no1 .box .unit dl.col-2 dt::before {
    content: "\02461";
}

.flow .list .item.no1 .box .unit dl.col-3 dt::before {
    content: "\02462";
}

.flow .list .item.no1 .box .unit dl.col-4 dt::before {
    content: "\02463";
}

.flow .list .item.no1 .box .unit dl.col-5 dt::before {
    content: "\02464";
}

.flow .list .item.no1 .box .unit dl dd {
    font-size: 15px;
    padding-left: 15px;
}

.flow .list .item.no1 .box .unit .cap {
    font-size: 15px;
    margin-top: 10px;
}

.flow .list .item.no1 .box .btn a {
    display: block;
    max-width: 380px;
    font-size: 15px;
    line-height: 1.4;
    color: #ffffff;
    background-color: #22283e;
    padding: 15px 30px;
    box-sizing: border-box;
    border: 1px solid #22283e;
    border-radius: 40px;
    position: relative;
    transition: .6s all;
}

.flow .list .item.no1 .box .btn a:hover {
    color: #22283e;
    background-color: #ffffff;
}

.flow .list .item.no1 .box .btn a::after {
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background-color: #ffffff;
    position: absolute;
    top: 0;
    right: 30px;
    bottom: 0;
    margin: auto;
    transition: .6s all;
}

.flow .list .item.no1 .box .btn a:hover::after {
    background-color: #22283e;
}

.flow .list .item.no1 .box .btn a span {
    display: block;
    font-size: 20px;
}

.flow .list .item.no2 .box {
    margin-top: 100px;
}

.flow .list .item.no2 .box .inner {
    padding: 80px 30px;
    background-color: #e0dbd6;
    position: relative;
}

.flow .list .item.no2 .box h3 {
    max-width: 466px;
    width: 100%;
    font-size: 20px;
    font-weight: bold;
    color: #ffffff;
    background-color: #22283e;
    border: 1px solid #22283e;
    text-align: center;
    padding: 10px 0;
    position: absolute;
    top: -25px;
    left: 30px;
}

.flow .list .item.no2 .box .unit + .unit {
    padding-top: 60px;
    margin-top: 60px;
    border-top: 1px solid #ffffff;
}

.flow .list .item.no2 .box .unit dl {
    width: 50%;
    float: left;
    margin-right: 20px;
}

.flow .list .item.no2 .box .unit dl dt {
    font-size: 20px;
    font-weight: bold;
    padding-left: 20px;
    margin-bottom: 20px;
    position: relative;
}

.flow .list .item.no2 .box .unit dl dt::before {
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no2 .box .unit.no1 dl dt::before {
    content: "\02460";
}

.flow .list .item.no2 .box .unit.no2 dl dt::before {
    content: "\02461";
}

.flow .list .item.no2 .box .unit.no3 dl dt::before {
    content: "\02462";
}

.flow .list .item.no2 .box .unit.no4 dl dt::before {
    content: "\02463";
}

.flow .list .item.no2 .box .unit.no5 dl dt::before {
    content: "\02464";
}

.flow .list .item.no2 .box .unit dl dd {
    padding-left: 20px;
}

.flow .list .item.no2 .box .unit dl dd + dd {
    margin-top: 10px;
}

.flow .list .item.no2 .box .unit dl dd.s-Cap {
    padding-left: 35px;
    margin-top: 20px;
    position: relative;
}

.flow .list .item.no2 .box .unit dl dd.s-Cap::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 20px;
}

.flow .list .item.no2 .box .unit dl dd span {
    display: block;
    font-size: 17px;
}

.flow .list .item.no2 .box .unit dl dd .s-Ttl {
    float: left;
    font-weight: bold;
    padding: 0 15px;
    box-sizing: border-box;
    position: relative;
}

.flow .list .item.no2 .box .unit dl dd .s-Ttl::before {
    content: "\02022";
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no2 .box .unit dl dd .s-Ttl::after {
    content: "：";
    position: absolute;
    top: 0;
    right: 0;
}

.flow .list .item.no2 .box .unit dl dd .p-Txt {
    float: left;
}

.flow .list .item.no2 .box .unit dl dd .p-Txt b {
    font-weight: bold;
}

.flow .list .item.no2 .box .unit .img-Box {
    width: calc(50% - 20px);
    float: left;
}

.flow .list .item.no2 .box .unit .img-Box .sample {
    width: calc(50% - 10px);
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}

.flow .list .item.no2 .box .unit .img-Box .sample:nth-child(2n) {
    margin-right: 0;
}

.flow .list .item.no2 .box .unit .sample h4 {
    font-size: 14px;
    font-weight: bold;
    letter-spacing: -2px;
}

.flow .list .item.no2 .box .unit .sample .s-Image {
    font-size: 0;
    border: 1px solid #d3d3d3;
}

.flow .list .item.no2 .box .unit .sample .s-Image img {
    width: 100%;
    height: auto;
}

.flow .list .item.no2 .box .unit .sample .cap-Txt {
    font-size: 12px;
    padding-left: 15px;
    position: relative;
}

.flow .list .item.no2 .box .unit .sample .cap-Txt::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no2 .box .cap {
    margin-top: 20px;
}

.flow .list .item.no2 .box .cap span {
    display: block;
}

.flow .list .item.no2 .box .cap .s-Txt {
    font-size: 18px;
    font-weight: bold;
    padding-left: 15px;
    margin-top: 10px;
    position: relative;
}

.flow .list .item.no2 .box .cap .s-Txt::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 0;
}

.flow .list .item.no8 .txt + .txt {
    font-size: 18px;
    font-weight: bold;
    padding-left: 20px;
    margin-top: 40px;
    position: relative;
}

.flow .list .item.no8 .txt + .txt::before {
    content: "\0274b";
    position: absolute;
    top: 0;
    left: 0;
}

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

    .flow .page-Ttl span {
        font-size: 38px;
    }

    .flow .list .item .f-Ttl span {
        display: block;
        padding-left: 0;
    }

    .flow .list .item.no2 .box .unit dl {
        width: 100%;
        margin-right: 0;
    }

    .flow .list .item.no2 .box .unit .img-Box {
        width: 100%;
    }

    .flow .list .item.no2 .box .unit .img-Box .sample {
        margin-top: 20px;
        margin-bottom: 0;
    }

}

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

    .flow .page-Ttl span {
        font-size: 24px;
    }

    .flow .list .item {
        padding-left: 0;
        position: relative;
    }

    .flow .list .item::after {
        content: "";
        display: block;
        width: 20px;
        height: 20px;
        background-color: #ffffff;
        border-left: 2px solid #22283e;
        border-bottom: 2px solid #22283e;
        position: absolute;
        top: -85px;
        right: 0;
        left: 0;
        margin: auto;
        transform: rotate(-45deg);
    }

    .flow .list .item.no1::after {
        content: none;
    }

    .flow .list .item .num {
        position: static;
        margin: 0 auto;
    }

    .flow .list .item .num::after {
        content: none;
    }

    .flow .list .item .f-Ttl {
        width: 100%;
        font-size: 22px;
        text-align: center;
        margin-bottom: 20px;
    }

    .flow .list .item.no2 .f-Ttl {
        letter-spacing: -2px;
    }

    .flow .list .item.no5 .f-Ttl {
        letter-spacing: -1px;
    }

    .flow .list .item .image {
        width: 100%;
    }

    .flow .list .item .txt {
        width: 100%;
    }

    .flow .list .item.no1 .box .unit .inner {
        padding: 30px 15px;
    }

    .flow .list .item.no1 .box h3 {
        font-size: 18px;
    }

    .flow .list .item.no1 .box h3 span {
        font-size: 14px;
        padding-left: 15px;
    }

    .flow .list .item.no1 .box .unit .cap {
        font-size: 14px;
    }

    .flow .list .item.no1 .box .btn a {
        padding: 15px 20px;
    }

    .flow .list .item.no1 .box .btn a::after {
        width: 25px;
        right: 20px;
    }

    .flow .list .item.no2 .box {
        margin-top: 60px;
    }

    .flow .list .item.no2 .box .inner {
        padding: 140px 15px 60px 15px;
    }

    .flow .list .item.no2 .box h3 {
        font-size: 20px;
        top: 0;
        left: -1px;
    }

    .flow .list .item.no2 .box .unit + .unit {
        padding-top: 40px;
        margin-top: 40px;
    }

    .flow .list .item.no2 .box .unit dl dd .s-Ttl::after {
        content: none;
    }

    .flow .list .item.no2 .box .unit dl dd .p-Txt {
        padding-left: 15px;
    }

    .flow .list .item.no2 .box .unit .img-Box .sample {
        width: 100%;
    }

    .flow .list .item.no2 .box .unit .img-Box .sample {
        margin-right: 0;
    }

}


/*==========

single-Work

==========*/

.single-Work {
    margin-bottom: 160px;
}

.single-Work .content {
    margin-bottom: 140px;
}

.single-Work .ttl-Box {
    margin-bottom: 40px;
}

.single-Work .ttl-Box .ttl {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
}

.single-Work .ttl-Box .cat {
    font-size: 13px;
    color: #777777;
}

.single-Work .bg-Mainimage {
    margin-bottom: 60px;
}

.single-Work .bg-Mainimage span {
    display: block;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #888888;
    border: 1px solid #dfdfdf;
    box-sizing: border-box;
}

.single-Work .bg-Mainimage span::after {
    content: "";
    display: block;
    padding-top: 56%;
}

.single-Work .view-Box {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 100px;
}

.single-Work .movie-Box {
    margin-bottom: 20px;
}

.single-Work .movie-Box .inner {
    width: 100%;
    padding-top: 56.25%;
    height: 0px;
    position: relative;
}

.single-Work .movie-Box .inner iframe {
    width: 100%;
    height: 100%;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
}

.single-Work .left-Col {
    width: 420px;
}

.single-Work .left-Col .list {
    padding-right: 40px;
}

.single-Work .left-Col .list .item {
    color: #898989;
    margin-bottom: 10px;
}

.single-Work .left-Col .list .item:last-child {
    margin-bottom: 0;
}

.single-Work .left-Col .list .item span {
    display: inline-block;
    width: 120px;
}

.single-Work .left-Col .list .item a {
    color: #898989;
}

.single-Work .right-Col {
    width: calc(100% - 420px);
    border-left: 1px solid #bdbdbd;
    box-sizing: border-box;
}

.single-Work .right-Col .txt-Box {
    padding-left: 40px;
    margin-bottom: 60px;
}

.single-Work .right-Col .txt-Box p {
    font-size: 15px;
    line-height: 2;
}

.single-Work .right-Col .txt-Box p + p {
    padding-top: 20px;
}

.single-Work .img-Box ul li {
    float: left;
    width: calc(50% - 10px);
    margin-top: 20px;
    margin-right: 20px;
    border: 1px solid #dfdfdf;
    box-sizing: border-box;
}

.single-Work .img-Box ul li:nth-child(1),
.single-Work .img-Box ul li:nth-child(2) {
    margin-top: 0;
}

.single-Work .img-Box ul li:nth-child(2n) {
    margin-right: 0;
}

.single-Work .img-Box ul li figure {
    font-size: 0;
}

.single-Work .img-Box ul li figure img {
    width: 100%;
    height: auto;
}

.single-Work  .pln-Nav .list {
    padding: 30px 0;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    box-sizing: border-box;
    position: relative;
}

.single-Work  .pln-Nav .list li.prev {
    float: left;
}

.single-Work  .pln-Nav .list li.back {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.single-Work  .pln-Nav .list li.next {
    float: right;
}

.single-Work  .pln-Nav .list li a {
    font-size: 18px;
    position: relative;
}

.single-Work  .pln-Nav .list li.prev a {
    padding-left: 25px;
}

.single-Work  .pln-Nav .list li.prev a::before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    border-top: 1px solid #333333;
    border-left: 1px solid #333333;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(-45deg);
}

.single-Work  .pln-Nav .list li.back a {
    display: block;
    padding-left: 35px;
}

.single-Work .pln-Nav .list li.back a::before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-image: url(../images/works/square.png);
    background-size: cover;
    background-position: center center;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

.single-Work  .pln-Nav .list li.next a {
    padding-right: 25px;
}

.single-Work  .pln-Nav .list li.next a::after {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    border-top: 1px solid #333333;
    border-right: 1px solid #333333;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
}

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

    .single-Work .ttl-Box {
        margin-bottom: 20px;
    }

    .single-Work .bg-Mainimage {
        margin-bottom: 40px;
    }

    .single-Work .view-Box {
        margin-bottom: 80px;
    }

    .single-Work .left-Col {
        width: 100%;
    }

    .single-Work .right-Col {
        width: 100%;
        border-top: 1px solid #bdbdbd;
        border-left: 0;
        padding-top: 40px;
        margin-top: 40px;
    }

    .single-Work .left-Col .list {
        padding-right: 0;
    }

    .single-Work .right-Col .txt-Box {
        padding-left: 0;
        margin-bottom: 0;
    }

}

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

    .single-Work {
        margin-bottom: 140px;
    }

    .single-Work .content {
        margin-bottom: 100px;
    }

    .single-Work .bg-Mainimage span::after {
        padding-top: 70%;
    }

    .single-Work .view-Box {
        margin-bottom: 60px;
    }

    .single-Work .movie-Box .inner {
        padding-top: 70%;
    }

    .single-Work .left-Col .list .item {
        font-size: 14px;
    }

    .single-Work .img-Box ul li {
        width: 100%;
        margin-top: 10px;
        margin-right: 0;
    }

    .single-Work .img-Box ul li:nth-child(2) {
        margin-top: 10px;
    }

    .single-Work .pln-Nav .list li a {
        font-size: 16px;
    }

    .single-Work .pln-Nav .list li.prev a {
        padding-left: 20px;
    }

    .single-Work .pln-Nav .list li.prev a::before {
        width: 20px;
        height: 20px;
    }

    .single-Work .pln-Nav .list li.back a {
        width: 30px;
        height: 30px;
        padding-left: 0;
    }

    .single-Work .pln-Nav .list li.back a span {
        display: none;
    }

    .single-Work .pln-Nav .list li.next a {
        padding-right: 20px;
    }

    .single-Work .pln-Nav .list li.next a::after {
        width: 20px;
        height: 20px;
    }

}


/*==========

news

==========*/

.news {
    margin-bottom: 160px;
}

.news .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.news .page-Ttl span {
    display: block;
    font-size: 68px;
    color: #a59b93;
}

.news .left-Content {
    width: calc(100% - 280px);
    float: left;
}

.news .left-Content .list {
    margin-bottom: 60px;
}

.news .left-Content .list .item {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 40px;
    margin-bottom: 40px;
    box-sizing: border-box;
    border-bottom: 1px solid #e2dcd7;
}

.news .left-Content .list .item:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
}

.news .left-Content .list .item .box {
    margin-bottom: 15px;
}

.news .left-Content .list .item .box .cat {
    display: inline;
    font-size: 14px;
	color: #a0948a;
    padding-right: 10px;
}

.news .left-Content .list .item .box time {
    display: inline;
    font-size: 14px;
    color: #a0948a;
}

.news .left-Content .list .item a {
	font-size: 18px;
}

.news .left-Content .list .item a:hover {
    text-decoration: underline;
}

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

    .news .page-Ttl span {
        font-size: 38px;
    }

    .news .left-Content {
        width: calc(100% - 220px);
    }

    .news .left-Content .list .item {
        padding-left: 10px;
        padding-right: 10px;
    }

    .news .left-Content .list .item a {
        font-size: 15px;
    }

}

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

    .news {
        margin-bottom: 140px;
    }

    .news .page-Ttl span {
        font-size: 28px;
    }

    .news .left-Content {
        width: 100%
    }

    .news .left-Content .list {
        margin-bottom: 100px;
    }

    .news .left-Content .list .item {
        padding-bottom: 30px;
        margin-bottom: 30px;
    }

    .news .left-Content .list .item .box {
        margin-bottom: 10px;
    }

}


/*==========

single

==========*/

.single {
    margin-bottom: 160px;
}

.single .left-Content {
    width: calc(100% - 280px);
    float: left;
}

.single .info-Box {
    margin-bottom: 10px;
}

.single .info-Box .cat {
    display: inline;
    padding-right: 10px;
}

.single .ttl {
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 20px;
}

.single .txt-Box {
    margin-bottom: 120px;
}

.single .txt-Box p {
    font-size: 15px;
    line-height: 2;
}

.single .txt-Box img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.single .pln-Nav .list {
    padding: 30px 0;
    border-top: 1px solid #333333;
    border-bottom: 1px solid #333333;
    box-sizing: border-box;
    position: relative;
}

.single .pln-Nav .list li.prev {
    float: left;
}

.single .pln-Nav .list li a {
    font-size: 18px;
    position: relative;
}

.single .pln-Nav .list li.prev a {
    padding-left: 25px;
}

.single .pln-Nav .list li.prev a::before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    border-top: 1px solid #333333;
    border-left: 1px solid #333333;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(-45deg);
}

.single .pln-Nav .list li.next {
    float: right;
}

.single .pln-Nav .list li.next a {
    padding-right: 25px;
}

.single .pln-Nav .list li.next a::after {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    border-top: 1px solid #333333;
    border-right: 1px solid #333333;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    transform: rotate(45deg);
}

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

    .single .left-Content {
        width: calc(100% - 220px);
    }

    .single .ttl {
        font-size: 20px;
    }

    .single .txt-Box {
        margin-bottom: 100px;
    }

}

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

    .single {
        margin-bottom: 140px;
    }

    .single .left-Content {
        width: 100%;
        margin-bottom: 100px;
    }

    .single .info-Box .cat {
        font-size: 14px;
    }

    .single .info-Box time {
        font-size: 14px;
    }

    .single-Work .pln-Nav .list li a {
        font-size: 16px;
    }

    .single .pln-Nav .list li.prev a {
        padding-left: 20px;
    }

    .single .pln-Nav .list li.prev a::before {
        width: 20px;
        height: 20px;
    }

    .single .pln-Nav .list li.next a {
        padding-right: 20px;
    }

    .single .pln-Nav .list li.next a::after {
        width: 20px;
        height: 20px;
    }

}


/*==========

contact

==========*/

#page-9 .st-Contact {
    display: none;
}

.contact {
    margin-bottom: 160px;
}

.contact .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.contact .page-Ttl span {
    display: block;
	font-size: 68px;
    color: #a59b93;
}

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

.contact form {
    max-width: 890px;
    margin-top: 60px;
    margin-left: auto;
    margin-right: auto;
}

.contact form .box {
    padding-right: 20px;
    padding-left: 20px;
    box-sizing: border-box;
}

.contact form .box + .box {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid #e2dcd7;
}

.contact form .box dt {
    width: 240px;
    font-size: 13px;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    float: left;
    position: relative;
}

.contact form .box dt .en {
    display: block;
    color: #a59b93;
    font-size: 15px;
}

.contact form .box.required dt::after {
    content: "必須";
    font-size: 12px;
    color: #ffffff;
    background-color: #22283e;
    padding: 5px;
    position: absolute;
    top: 5px;
    right: 15px;
}

.contact form .box dd {
    width: calc(100% - 240px);
    float: right;
}

.contact form .box dd .cap {
    display: block;
}

.contact form .sg-Box dd .mwform-radio-field {
    display: block;
}

.contact .sg-Box .mwform-radio-field label {
    display: block;
    position: relative;
    padding-left: 25px;
    box-sizing: border-box;
}

.contact .sg-Box .mwform-radio-field label input {
    position: absolute;
    top: 4px;
    left: 0;
}

.contact form .sg-Box dd .mwform-radio-field span {
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
}

.contact form .sg-Box dd .mwform-radio-field + .mwform-radio-field {
    margin-top: 15px;
}

.contact form .ly-Item input {
    max-width: 500px;
    width: 100%;
    font-size: 15px;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    background-color: #f5f5f5;
    padding: 10px;
    border: none;
    box-sizing: border-box;
}

.contact form .ad-Box input {
	max-width: 100%;
}

.contact form .ly-Item.phone-Box input {
    max-width: 100px;
}

.contact form .ly-Item.pc-Box input {
    max-width: 80px;
}

.contact form .ly-Item textarea {
    width: 100%;
    height: 320px;
    font-size: 15px;
    font-family: -apple-system, YuGothic, "Yu Gothic Medium", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji";
    background-color: #f5f5f5;
    padding: 10px;
    border: none;
    box-sizing: border-box;
}

.contact form input::placeholder {
    color: #9c9c9c;
}
  
.contact form input:-ms-input-placeholder {
    color: #9c9c9c;
}
  
.contact form input::-ms-input-placeholder {
    color: #9c9c9c;
}

.contact form .ms-Box .ms-parent {
	width: 340px;
}

.contact form .sd-Btn {
    padding-top: 30px;
    margin-top: 30px;
    border-top: 1px solid #e2dcd7;
}

.contact form .sd-Btn input {
    display: block;
    max-width: 320px;
    width: 100%;
    color: #ffffff;
    font-size: 15px;
    background-color: #22283e;
    border: 1px solid #22283e;
    text-align: center;
    padding: 20px 0;
    margin: 0 auto;
    transition: .6s all;
}

.contact form .sd-Btn input:hover {
    color: #22283e;
    background-color: #ffffff;
}


@media screen and (max-width: 1024px) {
    
    .contact .page-Ttl span {
        font-size: 28px;
    }

}


@media screen and (max-width: 767px) {
    
    .contact .page-Ttl span {
        font-size: 34px;
    }

    .contact .txt {
        text-align: left;
    }

    .contact form .box {
        padding-right: 0;
        padding-left: 0;
    }

    .contact form .box + .box {
        padding-top: 40px;
        margin-top: 40px;
    }
    
    .contact form .box dt {
        width: auto;
        padding-right: 50px;
        margin-bottom: 15px;
    }

    .contact form .box.required dt::after {
        right: 0;
    }

    .contact form .box dd {
        width: 100%;
    }

    .contact form .ly-Item.phone-Box input {
        max-width: 80px;
    }
	
	.contact form .ms-Box .ms-parent {
		width: auto;
	}


}


/*==========

pp

==========*/

.pp {
    margin-bottom: 160px;
}

.pp .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.pp .page-Ttl span {
    display: block;
    font-size: 68px;
    color: #a59b93;
}

.pp .column {
    padding-bottom: 60px;
    margin-bottom: 60px;
    border-bottom: 1px solid #e2dcd7;
}

.pp .column h2 {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 40px;
}

.pp .column p {
    font-size: 15px;
}

.pp .column .txt {
    margin-bottom: 40px;
}

.pp .column .item {
    margin-bottom: 40px;
}

.pp .column .item dt {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}

.pp .column .item dd {
    font-size: 15px;
}

.pp .column .item.dot dd {
    padding-left: 15px;
    margin-bottom: 20px;
    position: relative;
}

.pp .column .item.dot dd::before {
    content: "\02022";
    position: absolute;
    top: 0;
    left: 0;
}

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

    .pp .page-Ttl span {
        font-size: 38px;
    }

    .pp .column {
        padding-bottom: 40px;
        margin-bottom: 40px;
    }

    .pp .column h2 {
        margin-bottom: 30px;
    }

    .pp .column .txt {
        margin-bottom: 30px;
    }

    .pp .column .item {
        margin-bottom: 30px;
    }

}

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

    .pp {
        margin-bottom: 140px;
    }

    .pp .page-Ttl span {
        font-size: 28px;
    }

    .pp .column h2 {
        font-size: 20px;
    }

}


/*==========

sitemap

==========*/

.sitemap {
    margin-bottom: 160px;
}

.sitemap .page-Ttl {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 40px;
}

.sitemap .page-Ttl span {
    display: block;
    font-size: 68px;
    color: #a59b93;
}

.sitemap .list a:hover {
    color: #a59b93;
    text-decoration: underline
}

.sitemap .list .item {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #e2dcd7;
}

.sitemap .list .item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border: 0;
}

.sitemap .mini-List .mini-Item {
    font-size: 16px;
    font-weight: normal;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 30px;
}

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

    .sitemap {
        margin-bottom: 140px;
    }

    .sitemap .page-Ttl span {
        font-size: 28px;
    }

    .sitemap .column h2 {
        font-size: 20px;
    }

    .sitemap .mini-List .mini-Item {
        float: none;
        padding-left: 20px;
        padding-right: 0;
        margin-top: 20px;
    }

}