@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(max-width:999px){

/*-----STYLE-----*/
.pc {
    display:none;
}

.wrap {
    padding-top:70px;
}

.cts {
    width:90%;
}

.back_btn {
    margin-top:50px;
    text-align:center;
}

.back_btn .btn {
    display:inline-block;
}

.back_btn .btn a {
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    border:#e1e1e1 1px solid;
    padding:8px 15px;
}

.back_btn .btn a:before {
    content:"";
    width:10px;
    height:10px;
    border-top:#e1e1e1 1px solid;
    border-left:#e1e1e1 1px solid;
    transform:rotate(-45deg);
    margin-right:10px;
}

.back_btn .btn p {
    font-size:90%;
}

.more_text {
    text-align:right;
    margin-top:10px;
}

.more_text .btn {
    display:inline-block;
}

.more_text .btn a {
    display:flex;
    justify-content:center;
    align-items:center;
}

.more_text .btn a p {
    font-size:100%;
    line-height:100%;
}

.more_text .btn a .arrowbox {
    width:18px;
    height:18px;
    border:#fff 1px solid;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-left:18px;
}

.more_text .btn a .arrowbox:before {
    content:"";
    width:8px;
    height:8px;
    border-top:#fff 1px solid;
    border-right:#fff 1px solid;
    transform:rotate(45deg);
    position:absolute;
    right:5px;
}

.more_text .btn a .arrowbox:after {
    content:"";
    width:20px;
    height:1px;
    background:#fff;
    position:absolute;
    right:5px;
}

.more_btn {
    text-align:right;
    margin-top:10px;
}

.more_btn .btn {
    display:inline-block;
}

.more_btn .btn a {
    display:flex;
    justify-content:center;
    align-items:center;
    border:#fff 1px solid;
    padding:12px 15px;
}

.more_btn .btn a p {
    font-size:90%;
    line-height:100%;
}

.more_btn .btn a .arrowbox {
    width:18px;
    height:18px;
    border:#fff 1px solid;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-left:18px;
}

.more_btn .btn a .arrowbox:before {
    content:"";
    width:8px;
    height:8px;
    border-top:#fff 1px solid;
    border-right:#fff 1px solid;
    transform:rotate(45deg);
    position:absolute;
    right:5px;
}

.more_btn .btn a .arrowbox:after {
    content:"";
    width:20px;
    height:1px;
    background:#fff;
    position:absolute;
    right:5px;
}

.logo_start {
    width:100vw;
    height:100vh;
    background:#323232 url(../img/bg.jpg) center / 1500px 1000px;
    position:fixed;
    z-index:99999;
    top:0;
    left:0;
    display:flex;
    justify-content:center;
    align-items:center;
}

.logo_start svg {
    width:120px;
}



/*-----HEADER-----*/
header {
    width:100%;
    height:70px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:fixed;
    top:0;
    left:0;
    z-index:9999;
}

header .logo {
    margin-left:15px;
}

header .logo a {
    display:flex;
    align-items:center;
}

header .logo a .symbol {
    width:54px;
    margin-right:10px;
}

header .logo a .names {
}

header .logo a .names .name {
    font-size:125%;
    line-height:100%;
    display:flex;
    align-items:center;
    color:#fff;
    margin-bottom:5px;
}

header .logo a .names .name .fs {
    font-size:60%;
    letter-spacing:1px;
}

header .logo a .names .en {
    font-size:80%;
    line-height:100%;
    color:#969696;
}

header h1 {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}



/*-----TOP-----*/
.titles {
    position:relative;
    z-index:1000;
}

.titles .title {
    position:relative;
    text-align:center;
}

.titles .title img {
    width:auto;
    height:60px;
}

.titles .subtitles {
    width:100%;
    position:absolute;
    text-align:center;
    left:0;
    right:0;
    bottom:-15px;
}

.titles .subtitles .subtitle {
    font-size:120%;
    font-weight:500;
    line-height:100%;
    color:#fff;
    display:inline-block;
    position:relative;
    text-shadow:0 0 6px rgba(0,0,0,0.8);
}

.titles .subtitles .underline {
    position:absolute;
    height:4px;
    background:#ccc;
    bottom:-10px;
    left:0;
    right:0;
    margin:auto;
}



/*-----MV-----*/
#mv {
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    margin-bottom:120px;
}

#mv .photo {
    width:calc(100% - 50px);
    min-height:450px;
    height:100vw;
    background:#ccc;
    margin:0 0 0 auto;
}

#mv .photo .mv_slider {
    width:100%;
    height:100%;
}

#mv .mv {
    width:100%;
    height:100%;
    background:#aaa;
}

#mv .mv.mv1 {
    background:url(../img/mv_1.jpg) center / cover;
}

#mv .mv.mv2 {
    background:url(../img/mv_2.jpg) center / cover;
}

#mv .mv.mv3 {
    background:url(../img/mv_3.jpg) center / cover;
}

#mv .copies {
    position:absolute;
    left:0;
    z-index:1000;
}

#mv .copies .copy {
    margin:15px 0;
}

#mv .copies .copy p {
    font-size:150%;
    line-height:100%;
    letter-spacing:3px;
    display:inline-block;
    background:#fff;
    color:#000;
    padding:8px 10px;
}

#mv .deco {
    width:70vw;
    position:absolute;
    right:20px;
    bottom:-35px;
    z-index:1001;
}

#mv .brush {
    width:250px;
    position:absolute;
    left:-20px;
    bottom:-50px;
    z-index:1000;
}



/*-----TOP_TOPICS-----*/
#top_topics {
    padding:30px 0 150px;
    position:relative;
}

#top_topics .titles {
    position:relative;
    z-index:1000;
    margin-bottom:30px;
}

#top_topics .title {
    position:relative;
    text-align:center;
    left:0;
    right:0;
    bottom:0;
    margin-bottom:10px;
}

#top_topics .title img {
    width:auto;
    height:55px;
}

#top_topics .subtitles {
    width:100%;
    position:relative;
    text-align:center;
    left:0;
    right:0;
    bottom:0;
}

#top_topics .subtitles .subtitle {
    font-size:120%;
    font-weight:500;
    line-height:100%;
    color:#fff;
    display:inline-block;
    position:relative;
    text-shadow:0 0 6px rgba(0,0,0,0.8);
}

#top_topics .subtitles .underline {
    background:#1e64b4;
}

#top_topics .details {
}

#top_topics .details .obj {
    width:90%;
    height:60px;
    position:absolute;
    top:0;
    left:0;
    right:0;
    margin:auto;
}

#top_topics .details .obj .blue {
    width:100%;
    height:100%;
    background:url(../img/bg_b.jpg) center / 1500px 1000px;
}

#top_topics .details .detail {
    width:100%;
}

.topics {
}

.topics .topic {
    border-bottom:#464646 1px solid;
    padding:25px 0 20px 0;
}

.topics .topic:first-child {
    border-top:#464646 1px solid;
}

.topics .topic .date_cate {
    display:flex;
    align-items:center;
    margin-bottom:7px;
}

.topics .topic .date_cate .date {
    line-height:100%;
    letter-spacing:2px;
}

.topics .topic .date_cate .cate {
    font-size:90%;
    line-height:100%;
    letter-spacing:2px;
    border-left:#646464 1px solid;
    padding-left:15px;
    margin-left:15px;
}

.topics .topic .subject p {
    letter-spacing:2px;
}



/*-----TOP_COMPANY-----*/
#top_company {
    padding:0 0 150px;
}

#top_company .cts {
    width:100%;
    position:relative;
}

#top_company .titles {
    position:relative;
    margin-bottom:35px;
}

#top_company .title {
    position:relative;
    text-align:center;
    left:0;
    right:0;
    bottom:0;
    margin-bottom:10px;
}

#top_company .title img {
    height:55px;
}

#top_company .titles .subtitles {
    width:100%;
    position:relative;
    text-align:center;
    left:0;
    right:0;
    bottom:0;
}

#top_company .titles .subtitles .subtitle {
}

#top_company .subtitles .underline {
    background:#46b478;
}

#top_company .details {
}

#top_company .details .photos {
    width:100%;
    position:relative;
    margin-bottom:30px;
}

#top_company .details .photos .photo {
    width:100%;
    height:70vw;
    background:url(../img/company.jpg) center /cover;
    position:relative;
    z-index:1;
}

#top_company .details .photos .brush {
    width:250px;
    position:absolute;
    bottom:-100px;
    right:-50px;
    z-index:0;
}

#top_company .details .detail {
    width:90%;
    margin:auto;
}

#top_company .details .detail .subject {
    font-size:150%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:20px;
}

#top_company .details .detail .tx {
    line-height:180%;
    letter-spacing:3px;
    margin-bottom:30px;
}

#top_company .more_btn {
    text-align:center;
}



/*-----TOP_GROUP-----*/
#top_group {
    padding:0 0 200px;
}

#top_group .titles {
    position:relative;
    margin-bottom:30px;
}

#top_group .titles .title {
    margin-bottom:10px;
}

#top_group .title img {
    height:50px;
}

#top_group .titles .subtitles {
    position:relative;
    bottom:0;
}

#top_group .titles .subtitles .subtitle {
}

#top_group .subtitles .underline {
    background:#7864b4;
}

#top_group .copy {
    text-align:center;
    margin-bottom:25px;
}

#top_group .companies {
    display:flex;
    justify-content:space-between;
    position:relative;
}

#top_group .companies .brush {
    position:absolute;
    width:250px;
    bottom:-100px;
    left:0;
    right:0;
    margin:auto;
}

#top_group .companies .company {
    width:48%;
    position:relative;
}

#top_group .companies .company .photo {
    margin-bottom:15px;
}

#top_group .companies .company .data {
    text-align:center;
    margin-bottom:15px;
}

#top_group .companies .company .data .name {
    font-size:110%;
    margin-bottom:5px;
}

#top_group .companies .company .data .address {
    font-size:70%;
    color:#969696;
}

#top_group .companies .company .more_btn {
    text-align:center;
}



/*-----TOP_SERVICE-----*/
#top_service {
    padding:0 0 200px;
}

#top_service .cts {
    position:relative;
    padding-top:80px;
}

#top_service .titles {
    position:absolute;
    top:0;
    right:15px;
}

#top_service .title {
    position:relative;
    text-align:center;
}

#top_service .title img {
    height:55px;
}

#top_service .titles .subtitles {
    text-align:right;
}

#top_service .titles .subtitles .subtitle {
}

#top_service .subtitles .underline {
    background:#f0a046;
}

#top_service .contents {
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    margin-bottom:20px;
    position:relative;
}

#top_service .contents .content {
    width:47.5%;
    height:60vw;
    position:relative;
}

#top_service .contents .content:first-child {
    background:url(../img/service_1.jpg) center / cover;
}

#top_service .contents .content:nth-child(2) {
    background:url(../img/service_2.jpg) center / cover;
}

#top_service .contents .content:nth-child(3) {
    background:url(../img/service_3.jpg) center / cover;
}

#top_service .contents .content:last-child {
    background:url(../img/service_4.jpg) center / cover;
}

#top_service .contents .content:nth-child(2n) {
    margin-top:20px;
}

#top_service .contents .content .point {
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
}

#top_service .contents .content .point p {
    width:100%;
    font-size:70%;
    line-height:135%;
    display:block;
    background:rgba(0,0,0,0.9);
    padding:8px 10px;
}

#top_service .details {
    width:100%;
    margin:auto;
}

#top_service .details .photos {
    width:60%;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0 auto 20px;
}

#top_service .details .photos .photo {
    width:100%;
    position:relative;
    z-index:1;
}

#top_service .details .photos .brush {
    width:250px;
    position:absolute;
}

#top_service .details .detail {
    width:100%;
}

#top_service .details .detail .subject {
    font-size:150%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:15px;
    text-align:center;
}

#top_service .details .detail .tx {
    line-height:180%;
    letter-spacing:3px;
    margin-bottom:30px;
}

#top_service .more_btn {
    text-align:center;
}



/*-----PAGE-----*/
.pagetitles {
    width:100%;
    height:200px;
    background:url(../img/under_title_bg.jpg) center / cover;
    position:relative;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.pagetitles .bg {
    width:50%;
    height:200px;
    position:absolute;
    right:0;
}

.pagetitles .pagetitle {
    width:90%;
    margin:auto;
    position:relative;
}

.pagetitles .pagetitle .subject {
    margin-bottom:12px;
}

.pagetitles .pagetitle .subject img {
    width:auto;
    height:50px;
}

.pagetitles .pagetitle .kana {
    font-size:90%;
    font-weight:500;
    line-height:100%;
}

.under {
    margin-bottom:150px;
}

.under .bread {
    width:90%;
    margin:12px auto 50px;
    text-align:right;
}

.under .bread p {
    font-size:60%;
}

.under .catetitles {
    text-align:center;
    margin-bottom:30px;
}

.under .catetitles .catetitle {
    font-size:110%;
    font-weight:500;
    line-height:100%;
    color:#fff;
    display:inline-block;
    position:relative;
    text-shadow:0 0 6px rgba(0,0,0,0.8);
}

.under .catetitles .catetitle .underline {
    position:absolute;
    height:4px;
    background:#ccc;
    bottom:-10px;
    left:0;
    right:0;
    margin:auto;
}



/*----- TOPICS -----*/
#topics_index {
}

#topics_index .pagetitles .bg {
    background:url(../topics/img/pagetitle_bg.png) center / cover;
}

#topics_index .category {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:20px;
}

#topics_index .category nav {
    width:32%;
    margin:0 2% 2% 0;
}

#topics_index .category nav:nth-child(3n) {
    margin-right:0;
}

#topics_index .category nav a {
    line-height:100%;
    border:#e1e1e1 1px solid;
    display:block;
    padding:12px 18px;
    text-align:center;
}

#topics_index .category nav a p {
    font-size:90%;
    font-weight:500;
    line-height:100%;
}

#topics_index .category nav.now a {
    pointer-events:none;
    background:#1e64b4;
    border:#1e64b4 1px solid;
}

#topics_index .category nav.now a p {
    color:#fff;
    line-height:100%;
}

#topics_index .category nav.none a {
    pointer-events:none;
    opacity:0.3;
}

#topics_index .topics {
    position:relative;
    margin-bottom:35px;
}

#topics_index .topics .topic {
    position:relative;
    border-bottom:#464646 1px solid;
}

#topics_index .topics .topic:first-child {
    border-top:#464646 1px solid;
}

#topics_index .topics .topic a {
    padding:15px 0;
    position:relative;
}

#topics_index .topics .topic a .date_cate {
    display:flex;
    align-items:center;
    margin-top:1px;
}

#topics_index .topics .topic a .date_cate .date {
}

#topics_index .topics .topic a .date_cate .cate {
    display:flex;
    justify-content:center;
    align-items:center;
    padding:0 5px 0 15px;
}

#topics_index .topics .topic a .date_cate .cate p {
    line-height:150%;
}

#topics_index .topics .topic a .subject {
    width:100%;
}

.pagenation {
    display:flex;
    justify-content:center;
    align-items:center;
    margin-top:30px;
}

.pagenation nav {
    line-height:100%;
    margin:0 5px;
}

.pagenation nav:first-child {
}

.pagenation nav a {
    font-size:90%;
    border:#e1e1e1 1px solid;
    display:flex;
    justify-content:center;
    align-items:center;
    min-width:30px;
    height:30px;
    padding:0 10px;
}

.pagenation nav.now a {
    pointer-events:none;
    background:#333;
    border:#333 1px solid;
}

.pagenation nav.now a p {
    color:#fff;
    line-height:100%;
}

.pagenation nav.none a {
    pointer-events:none;
    opacity:0.3;
}



/*-----TOPICS DETAIL-----*/
#topics_detail {
}

#topics_detail .pagetitles .bg {
    background:url(../topics/img/pagetitle_bg.png) center / cover;
}

#topics_detail .cts {
}

#topics_detail article {
    background:rgba(0,0,0,0.2);
    padding:30px 30px;
}

#topics_detail article p {
}

#topics_detail article .corner {
    text-align:center;
}

#topics_detail article .corner .cate_titles {
    margin-bottom:30px;
}

#topics_detail article .corner .cate_title {
    color:#c8b478;   
}

#topics_detail article h2 {
    font-size:150%;
    line-height:145%;
    margin-bottom:10px;
}

#topics_detail article .date_cate {
    display:flex;
    align-items:center;
}

#topics_detail article .date_cate .date {
    font-size:90%;
    margin-right:15px;
}

#topics_detail article .date_cate .cate {
    font-size:80%;
    line-height:100%;
    padding:3px 5px 3px 15px;
    border-left:#646464 1px solid;
}

#topics_detail article .photo {
    margin-top:30px;
}

#topics_detail article .ex {
    margin-top:30px;
}

#topics_detail article .ex p {
    font-size:100%;
    line-height:180%;
}

#topics_detail article .youtube {
    margin:30px auto 0;
    padding-top: 56.25%;
    position:relative;
}

#topics_detail article .youtube iframe {
    position: absolute;
    top:0;
    right:0;
    width:100% !important;
    height:100% !important;
}

#topics_detail article .btns {
    margin-top:35px;
}

#topics_detail article .btns .btn {
    position:relative;
    display:flex;
    align-items:center;
    border-bottom:#464646 1px solid;
}

#topics_detail article .btns .btn:first-child {
    border-top:#464646 1px solid;
}

#topics_detail article .btns .btn:last-child {
    margin-bottom:0;
}

#topics_detail article .btns .btn .icon {
    width:25px;
    margin-right:10px;
}

#topics_detail article .btns .btn a {
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    position:relative;
    padding:20px 25px 20px 0;
}

#topics_detail article .btns .btn a p {
    font-weight:500;
    letter-spacing:2px;
}

#topics_detail article .btns .btn a:before {
    content:"";
    width:20px;
    height:1px;
    background:#e1e1e1;
    position:absolute;
    right:-2px;
}

#topics_detail article .btns .btn a:after {
    content:"";
    width:14px;
    height:14px;
    border-top:#e1e1e1 1px solid;
    border-right:#e1e1e1 1px solid;
    transform:rotate(45deg);
    position:absolute;
    right:0;
}



/*----- COMPANY -----*/
#company {
}

#company .pagetitles .bg {
    background:url(../company/img/pagetitle_bg.png) center / cover;
}

#company .catetitles .catetitle .underline {
    background:#46b478;
}

#company #message {
    margin-bottom:150px;
}

#company #message .details {
}

#company #message .details .photos {
    width:90%;
    position:relative;
    margin:0 auto 30px;
}

#company #message .details .photos .deco {
    width:250px;
    position:absolute;
    bottom:-70px;
    right:-100px;
}

#company #message .details .photos .main_photo {
    margin-bottom:20px;
    position:relative;
}

#company #message .details .photos .sub_photo {
    display:flex;
    justify-content:space-between;
    position:relative;
}

#company #message .details .photos .sub_photo .photo {
    width:calc(50% - 10px);
}

#company #message .details .detail {
    width:100%;
}

#company #message .details .detail .copy {
    font-size:150%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:15px;
    text-align:center;
}

#company #message .details .detail .tx {
    margin-bottom:20px;
}

#company #message .details .detail .tx p {
    line-height:180%;
    letter-spacing:3px;
    margin-bottom:30px;
}

#company #message .details .detail .tx p:last-child {
    margin-bottom:0;
}

#company #message .details .detail .sign {
    width:150px;
    margin:0 0 0 auto;
}

#company #overview {
    margin-bottom:150px;
}

#company #overview .overviews {
}

#company #overview .overviews .overview {
    border-bottom:#464646 1px solid;
    padding:20px 0;
    display:flex;
}

#company #overview .overviews .overview:first-child {
    border-top:#464646 1px solid;
}

#company #overview .overviews .overview .item {
    width:20%;
}

#company #overview .overviews .overview .detail {
    width:80%;
}

#company #access {
}

#company #access .map {
    width:100%;
    height:70vw;
    margin-bottom:20px;
}

#company #access .map iframe {
    /*filter: grayscale(100%);*/
}

#company #access .name {
    font-size:110%;
    margin-bottom:5px;
}

#company #access .address {
    font-size:90%;
}



/*----- GROUP -----*/
#group {
}

#group .pagetitles .bg {
    background:url(../group/img/pagetitle_bg.png) center / cover;
}

#group .catetitles .catetitle .underline {
    background:#7864b4;
}

#group .cts {
}

#group .catetitles {
    text-align:center;
    margin-bottom:15px;
}

#group .companies {
}

#group .companies .company {
    margin-bottom:150px;
}

#group .anchor {
    margin-top:-100px;
    padding-top:100px;
}

#group .companies .company .names {
    margin-bottom:30px;
}

#group .companies .company .names .name {
    font-size:150%;
    text-align:center;
}

#group .companies .company .names .kana {
    font-size:70%;
    text-align:center;
}

#group .companies .company .details {
    margin-bottom:35px;
}

#group .companies .company .details .photo {
    width:100%;
    margin-bottom:25px;
}

#group .companies .company .details .detail {
    width:100%;
}

#group .companies .company .details .detail .detail_cts {
    width:100%;
}

#group .companies .company .details .detail .detail_cts .copy {
    font-size:150%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:20px;
    text-align:center;
}

#group .companies .company .details .detail .detail_cts .tx {
    margin-bottom:30px;
}

#group .companies .company .details .detail .detail_cts .tx p {
    line-height:180%;
    letter-spacing:3px;
    margin-bottom:30px;
}

#group .companies .company .details .detail .detail_cts .tx p:last-child {
    margin-bottom:0;
}

#group .companies .company .message {
    width:100%;
    margin-bottom:50px;
    background:rgba(0,0,0,0.3);
    padding:25px;
}

#group .companies .company .message .photo {
    width:50%;
    margin:0 auto 25px;
}

#group .companies .company .message .detail {
    width:100%;
}

#group .companies .company .message .detail .copy {
    font-size:120%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:15px;
    text-align:center;
}

#group .companies .company .message .detail .tx {
    line-height:180%;
    letter-spacing:3px;
}

#group .companies .company .message .detail .sign {
    text-align:right;
}

#group .companies .company .information {
    width:100%;
    margin:0 auto 30px;
}

#group .companies .company .information .data {
    width:100%;
    margin-bottom:25px;
}

#group .companies .company .information .data .subject {
    font-size:80%;
    padding-bottom:10px;
    border-bottom:#464646 1px solid;
}

#group .companies .company .information .data .overviews {
}

#group .companies .company .information .data .overviews .overview {
    border-bottom:#464646 1px solid;
    padding:20px 0;
    display:flex;
}

#group .companies .company .information .data .overviews .overview .item {
    width:100px;
}

#group .companies .company .information .data .overviews .overview .detail {
    width:calc(100% - 150px);
}

#group .companies .company .information .map {
    width:100%;
    height:70vw;
}

#group .companies .company .information .map iframe {
    /*filter: grayscale(100%);*/
}

#group .companies .company .company_slider {
    width:100%;
}



/*----- SERVICE -----*/
#service {
}

#service .cts {
}

#service .pagetitles .bg {
    background:url(../service/img/pagetitle_bg.png) center / cover;
}

#service .catetitles .catetitle .underline {
    background:#f0a046;
}

#service .intro {
    margin-bottom:90px;
}

#service .intro .copy {
    font-size:150%;
    line-height:150%;
    letter-spacing:2px;
    margin-bottom:15px;
    text-align:center;
}

#service .intro .tx {
    line-height:180%;
    letter-spacing:3px;
    margin-bottom:30px;
}

#service .services {
    margin-bottom:150px;
}

#service .services .service {
    margin-bottom:150px;
    position:relative;
}

#service .services .service:nth-child(even) {
    flex-direction:row-reverse;
}

#service .services .service:last-child {
    margin-bottom:0;
}

#service .services .service .photos {
    width:100%;
    height:60vw;
    position:relative;
    margin-bottom:45px;
}

#service .services .service .photos .deco {
    width:100%;
    height:60vw;
    position:absolute;
}

#service .services .service:nth-child(odd) .photos .deco {
    left:-25px;
    bottom:-22px;
}

#service .services .service:nth-child(even) .photos .deco {
    right:-25px;
    bottom:-22px;
}

#service .services .service1 .photos .deco {
    background:url(../service/img/deco_1.jpg) center / cover;
}

#service .services .service2 .photos .deco {
    background:url(../service/img/deco_2.jpg) center / cover;
}

#service .services .service3 .photos .deco {
    background:url(../service/img/deco_3.jpg) center / cover;
}

#service .services .service4 .photos .deco {
    background:url(../service/img/deco_4.jpg) center / cover;
}

#service .services .service .photos .brush {
    width:250px;
    position:absolute;
    bottom:-100px;
    right:-150px;
    display:none;
}

#service .services .service .photos .photo {
    width:100%;
    height:100%;
    position:relative;
}

#service .services .service1 .photos .photo {
    background:url(../service/img/photo_1.jpg) center / cover;
}

#service .services .service2 .photos .photo {
    background:url(../service/img/photo_2.jpg) center / cover;
}

#service .services .service3 .photos .photo {
    background:url(../service/img/photo_3.jpg) center / cover;
}

#service .services .service4 .photos .photo {
    background:url(../service/img/photo_4.jpg) center / cover;
}

#service .services .service .detail {
    width:100%;
}

#service .services .service .detail .detail_cts {
    width:100%;
}

#service .services .service .detail .detail_cts .kana {
    position:absolute;
    top:0;
}

#service .services .service:nth-child(odd) .detail .detail_cts .kana {
    right:-4%;
    top:-35px;
}

#service .services .service:nth-child(even) .detail .detail_cts .kana {
    left:-4%;
    top:-35px;
}

#service .services .service .detail .detail_cts .kana img {
    width:auto;
    height:50px;
}

#service .services .service:nth-child(odd) .detail .detail_cts {
}

#service .services .service:nth-child(even) .detail .detail_cts {
}

#service .services .service .detail .detail_cts .subject {
    font-size:150%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:15px;
    text-align:center;
}

#service .services .service .detail .detail_cts .tx {
    line-height:180%;
    letter-spacing:3px;
}

#service #gallery {
    width:100%;
    margin:auto;
}

#service #gallery .copy {
    line-height:180%;
    letter-spacing:3px;
    text-align:center;
    margin-bottom:30px;
}

#service #gallery .galleries {
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
}

#service #gallery .galleries li {
    width:28vw;
    height:28vw;
    overflow:hidden;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:15px;
}

#service #gallery .galleries li img {
    min-width:220px;
    min-height:220px;
}



/*----- CONTACT -----*/
#contact {
}

#contact .pagetitles .bg {
    background:url(../contact/img/pagetitle_bg.png) center / cover;
}

#contact .cts {
    background:rgba(0,0,0,0.2);
    padding:30px 30px;
}

#contact .corner {
    text-align:center;
}

#contact .intro {
    margin-bottom:50px;
    text-align:center;
}

#contact .intro h2 {
    font-size:150%;
    font-weight:500;
    margin-bottom:5px;
}

#contact .intro .tx {
}

#contact h3 {
    border-left:#ff6464 4px solid;
    padding:3px 0 3px 10px;
    margin-bottom:10px;
    font-weight:600;
}

#contact #contact_tel {
    margin-bottom:50px;
    display:none;
}

#contact #contact_tel .tel_cts {
    background:#fafafa;
    padding:20px 30px;
    text-align:center;
}

#contact #contact_tel .tel_cts .item {
    margin-bottom:5px;
}

#contact #contact_tel .tel_cts .number {
    font-size:180%;
    font-weight:600;
    line-height:100%;
}

#contact #contact_form {
}

#contact #contact_form .form_cts {
}

#contact #contact_form .form_cts {
}

#contact #contact_form .form_cts .copy {
    margin-bottom:20px;
}

#contact #contact_form .form_cts .copy .tx {
}

#contact #contact_form .form_cts .copy .attention {
    font-size:80%;
    margin-top:3px;
}

#contact #contact_form .form_cts .forms {
}

#contact #contact_form .form_cts .forms .form {
    border-bottom:#464646 1px solid;
    padding:20px 0;
}

#contact #contact_form .form_cts .forms .form:first-child {
    border-top:#464646 1px solid;
}

#contact #contact_form .form_cts .forms .form .items {
    width:100%;
    display:flex;
    align-items:center;
    margin-bottom:10px;
}

#contact #contact_form .form_cts .forms .form .items .required {
    font-size:70%;
    line-height:100%;
    padding:3px 5px;
    margin-right:10px;
    border:#ff6464 1px solid;
    color:#ff6464;
}

#contact #contact_form .form_cts .forms .form .items .any {
    font-size:70%;
    line-height:100%;
    padding:3px 5px;
    margin-right:10px;
    border:#464646 1px solid;
    color:#464646;
}

#contact #contact_form .form_cts .forms .form .items .item {
}

#contact #contact_form .form_cts .forms .form .detail {
    width:100%;
}

#contact #contact_form .form_cts .forms .form:nth-last-child(-n+2) {
    align-items:flex-start;
}



/*FORM*/
input,textarea,select {
    padding:15px 18px;
}

form .style_name {
    width:100%;
}

form .style_kana {
    width:100%;
}

form .style_mail {
    width:100%;
}

form .style_tel {
    width:100%;
}

form .style_select {
    width:100%;
}

form .style_detail {
    width:100%;
    height:250px;
    vertical-align:top;
}

form .btns {
    display:flex;
    justify-content:center;
    align-items:center;
    margin-top:20px;
}

form .warning {
    font-size:80%;
}

form .warning.block {
    display:block;
    line-height:100%;
    margin-top:10px;
    color:#ff6464;
}

form .btns .btn {
    margin:0 10px;
}

form .btns .btn input:hover {
    -webkit-animation:hover 0.5s ease forwards;
    animation:hover 0.5s ease forwards;
}

form .btns .btn .style_submit {
    border:none;
    background:#ff6464;
    width:120px;
    padding:15px;
    cursor:pointer;
    color:#fff;
    font-weight:600;
}

#contact .btns .btn .accepted:disabled {
    background:#323232;
    pointer-events:none;
    color:#646464;
}

form .btns .btn .style_fix {
    border:none;
    background:#464646;
    color:#fff;
    width:120px;
    padding:15px;
    cursor:pointer;
}

form .detail .privacy_policy {
}

form .detail .privacy_policy .privacies {
    height:250px;
    border:#464646 1px solid;
    padding:20px 25px;
    overflow-y:scroll;
    margin-bottom:12px;
}

form .detail .privacy_policy .privacies .privacy {
    border-bottom:#464646 1px solid;
    padding-bottom:15px;
    margin-bottom:15px;
}

form .detail .privacy_policy .privacies .privacy:last-child {
    border-bottom:none;
    padding-bottom:0;
    margin-bottom:0;
}

form .detail .privacy_policy .privacies .privacy .attention {
    display:flex;
    font-size:80%;
    padding-top:5px;
}

form .detail .privacy_policy .privacies .privacy .subject {
    font-size:80%;
    font-weight:500;
    color:#bbb;
    margin-bottom:3px;
}

form .detail .privacy_policy .privacies .privacy .tx {
    font-size:80%;
    color:#bbb;
}

form .detail .privacy_policy .privacies .privacy ul {
}

form .detail .privacy_policy .privacies .privacy ul li {
    display:flex;
}

form .detail .privacy_policy .privacies .privacy ul li p {
    font-size:80%;
}

form .detail .consent_cap {
    padding-bottom:12px;
}

form .detail .consent {
    display:flex;
    align-items:center;
    position:relative;
}

form .detail .consent label {
    cursor:pointer;
    padding-left:5px;
    font-weight:500;
    color:#ff6464;
    position:relative;
}

form .detail .consent label:before {
    content:"";
    width:15px;
    height:15px;
    border:#ff6464 1px solid;
    display:inline-block;
    position:absolute;
    top:5px;
    left:-20px;
}

form .detail .consent label:after {
    content:"";
    width:10px;
    height:15px;
    border-right:#ff6464 2px solid;
    border-bottom:#ff6464 2px solid;
    display:block;
    transform:rotate(45deg);
    position:absolute;
    top:0;
    left:-13px;
    opacity:0;
}

form .detail input[type="checkbox"] {
width:20px;
visibility:hidden;
}

form .detail input[type="checkbox"]:checked + label:after {
opacity:1;
}



/*THANKS*/
#contact .thanks h2 {
    margin-bottom:15px;
    color:#ff6464;
}
 
#contact .thanks .intro {
    margin-bottom:30px;
    text-align:left;
}

#contact .thanks .attention {
}

#contact .thanks .attention p {
    justify-content:center;
}



/*-----PRIVACY POLICY-----*/
#privacy {
}

#privacy .pagetitles .bg {
    background:url(../privacy/img/pagetitle_bg.png) center / cover;
}

#privacy .pagetitles .pagetitle .subject img {
    height:100px;
}

#privacy .privacies {
}

#privacy .privacies .privacy {
    border-bottom:#464646 1px solid;
    padding-bottom:20px;
    margin-bottom:20px;
}

#privacy .privacies .privacy:last-child {
    border-bottom:none;
    padding-bottom:0;
    margin-bottom:0;
}

#privacy .privacies .privacy .attention {
    display:flex;
    padding-top:5px;
}

#privacy .privacies .privacy .subject {
    font-weight:600;
    margin-bottom:3px;
    color:#ff6464;
}

#privacy .privacies .privacy .tx {
}

#privacy .privacies .privacy ul {
}

#privacy .privacies .privacy ul li {
    display:flex;
}

#privacy .privacies .privacy ul li p {
    font-size:80%;
}



/*-----GLOBAL-----*/
#global {
    margin-right:15px;
}

#global .nav_btn {
width:40px;
height:40px;
position:fixed;
top:15px;
right:20px;
z-index:998;
cursor:pointer;
}

#global .nav_close {
width:100%;
height:100%;
background:rgba(0,0,0,0.5);
position:fixed;
top:0;
left:0;
display:none;
cursor:pointer;
z-index:999;
}

#global .global_nav {
width:calc(100% - 80px);
height:100%;
position:fixed;
top:0;
left:0;
background:rgba(0,0,0,0.8);
display:flex;
justify-content:center;
align-items:center;
flex-direction:column;
transform:translate(-100%,0);
transition:0.5s;
z-index:1000;
padding:0 50px;
}

#global .global_nav.show {
transform:translate(0,0);
}

#global .global_nav nav {
padding:10px 0;
}

#global .global_nav nav a {
color:#fff;
}

#global .global_nav nav {
}

#global .global_nav .grnav {
    width:100%;
    border-bottom:#464646 1px solid;
}

#global .global_nav .grnav:first-child {
    border-top:#464646 1px solid;
}

#global .global_nav .grnav .nav_area {

}

#global .global_nav nav a {
    padding:20px;
    display:flex;
}

#global .global_nav nav .jp {
    font-size:100%;
    font-weight:400;
    line-height:100%;
    color:#fff;
}

#global .global_nav nav .en {
    font-size:70%;
    font-weight:300;
    font-style:italic;
    line-height:100%;
    color:#aaa;
}

#global .global_nav .open_nav {
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    height:60px;
    padding:15px 0;
}

#global .global_nav .open_nav nav {
}

#global .global_nav .open_nav.grnav {
    border-left:none;
}

#global .global_nav .navies {
    display:none;
    position:absolute;
    top:60px;
    width:180px;
}

#global .global_nav .navies .navi {
    border:#aaa 1px solid;
    border-top:none;
    background:#fff;
}

#global .global_nav .navies .navi:first-child {
    border-top:#aaa 1px solid;
}

#global .global_nav .navies .navi a {
    background:rgba(255,255,255,0.9);
    padding:10px 12px;
    display:flex;
    align-items:center;
    position:relative;
}

#global .global_nav .navies .navi a:before {
    content:"";
    width:11px;
    height:1px;
    background:#aaa;
    position:absolute;
    right:12px;
}

#global .global_nav .navies .navi a:after {
    content:"";
    width:8px;
    height:8px;
    border-top:#aaa 1px solid;
    border-right:#aaa 1px solid;
    transform:rotate(45deg);
    position:absolute;
    right:12px;
}

#global .global_nav .navies .navi a p {
    font-size:75%;
    font-weight:400;
    line-height:135%;
    letter-spacing:0;
    color:#aaa;
}

#global .global_nav .navies.show {
    display:block;
}

#global .global_nav .nav_cta {
}

#global .global_nav .nav_cta a {
    display:flex;
    justify-content:center;
    align-items:center;
    width:170px;
    height:56px;
    background:#2ca6e0;
    border-radius:4px;
}

#global .global_nav .nav_cta img {
    width:34px;
    margin-right:12px;
}

#global .global_nav .nav_cta .item {
}

#global .global_nav .nav_cta .item .jp {
    font-size:90%;
    line-height:100%;
    color:#fff;
}

#global .global_nav .nav_cta .item .en {
    font-size:70%;
    line-height:100%;
}



/*-----CTA-----*/
#cta {
    margin-bottom:50px;
}

#cta .titles {
    margin-bottom:50px;
}

#cta .titles .title img {
    height:50px;
}

#cta .titles .subtitles .subtitle .underline {
    background:#ff6464;
}

#cta .details {
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
}

#cta .details .photos {
    width:20%;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

#cta .details .photos .brush {
    width:150%;
    position:absolute;
    bottom:-25px;
}

#cta .details .photos .building {
    width:100%;
    position:relative;
}

#cta .details .detail {
    width:70%;
    margin-left:20px;
    position:relative;
}

#cta .details .detail .copy {
    font-size:100%;
    line-height:150%;
    letter-spacing:3px;
    margin-bottom:10px;
}

#cta .details .detail .tx {
    font-size:70%;
    line-height:180%;
    letter-spacing:1px;
    margin-bottom:20px;
}

.cta_btn {
}

.cta_btn .btn {
    display:inline-block;
}

.cta_btn .btn a {
    display:flex;
    justify-content:center;
    align-items:center;
    border:#fff 1px solid;
    padding:15px 20px;
}

.cta_btn .btn a p {
    font-size:90%;
    line-height:100%;
    letter-spacing:2px;
}

.cta_btn .btn a .arrowbox {
    width:15px;
    height:15px;
    border:#fff 1px solid;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-left:10px;
}

.cta_btn .btn a .arrowbox:before {
    content:"";
    width:6px;
    height:6px;
    border-top:#fff 1px solid;
    border-right:#fff 1px solid;
    transform:rotate(45deg);
    position:absolute;
    right:5px;
}

.cta_btn .btn a .arrowbox:after {
    content:"";
    width:15px;
    height:1px;
    background:#fff;
    position:absolute;
    right:5px;
}



/*-----BACK TO TOP-----*/
.BackToTop {
position:fixed;
width:35px;
right:25px;
bottom:0;
z-index:100;
display:none;
}



/*-----FOOTER-----*/
footer {
padding:50px 0 25px;
}

footer .data {
    text-align:center;
    position:relative;
    margin-bottom:20px;
}

footer .data:after {
    content:"";
    width:1px;
    height:50px;
    background:#464646;
    display:block;
    margin:20px auto 0;
    position:relative;
}

footer .data .logo {
    width:80px;
    margin:0 auto 15px;
}

footer .data .name {
    font-size:135%;
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:10px;
}

footer .data .name .fs {
    font-size:70%;
}

footer .data .address {
    font-size:80%;
}

footer .links {
    width:80%;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    margin:0 auto 50px;
    display:none;
}

footer .links a {
    width:30%;
    text-align:center;
}

footer .links a:last-child {
    margin-right:0;
}

footer .links a p {
    font-size:70%;
}

footer .copyright {
font-size:60%;
text-align:center;
}





}