/*
Theme Name:jtower_theme6
*/
html, body, p, h1, dt, dd, ul {margin: 0;}
html, body {height: auto;font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;color: #000;scroll-behavior: smooth; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
article{margin-top: 70px;}
p {word-wrap: break-word; }h1,h2{margin: 0;}ul {padding-left: 0; }li {list-style: none; }
a {text-decoration: none;color: #000;transition: 0.3s;cursor: pointer;}a:hover{opacity: 0.5;}
.sp {display: none !important; }

.ligin_header {
font-size: 10px;
color: #000;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
}

/*-------------------------------------------------------------btn*/
.btn_area {
width: 100%;
height: auto;
overflow: visible;
margin: 70px 0;
text-align: center;
}
.btn{
background: #187FC4;
width: auto;
height: 40px;
line-height: 40px;
color: #fff;
text-align: center;
padding: 0 50px;
font-size: 14px;
position: relative;
display: inline-block;
border-radius: 50px;
z-index: 1;
}
.btn:hover{opacity: 1;}
.btn:before{
content: "";
background-color: #187FC4;
opacity: 0.17;
width: 100%;
padding: 0 10px;
height: 60px;
position: absolute;
z-index: -1;
left: -10px;bottom: 0;top: 0;
margin: auto;
transition: 0.5s;
border-radius: 50px;
}
.btn:hover:before{opacity: 1;}

.btn_side{
background-color: #187FC4;
width: 46px;
height: 1px;
position: absolute;
right: -23px;top: 0;bottom: 0;
margin: auto;
z-index: 0;
transition: 0.5s;
}
.btn.move div.btn_side{right: -33px;}
.btn_side:before {
content: "";
background-color: #176192;
width: 10px;
height: 1px;
position: absolute;
right: -1px;
top: -3px;
margin: auto;
z-index: 0;
transition: 0.5s;
transform: rotateZ(45deg);
}
.btn_side:after{
content: "";
background-color: #fff;
width: 23px;
height: 1px;
position: absolute;
left: 0;top: 0;bottom: 0;
margin: auto;
z-index: 0;
transition: 0.5s;
}

/*-------------------------------------------------------------table*/
table {
width: 90%;
max-width: 800px;
margin: 75px auto 0 auto;
table-layout: fixed;
}
table th, table td {
height: 110px;
box-sizing: border-box;
padding: 40px 0 40px 30px;
vertical-align: top;
font-size: 14px;
font-weight: normal;
line-height: 2em;
}
table th {
width: 200px;
text-align: left;
border-top: 1px solid #0B68AF;
color: #0B68AF;
}
table td {border-top: 1px solid #C4C4C4;}

/*-------------------------------------------------------------form*/
form {text-align: center;}
form p{
width: 90%;
max-width: 900px;
margin: 0 auto;
font-size: 12px;
color:#0D8FE6;
text-align: left;
}
form table {width: 100%!important; margin-top: 0!important;display:block;}
    form tbody {display: flex;justify-content: space-between;flex-wrap: wrap;}
        form tr{width: 48%;display: inline-block;margin-bottom: 40px;}
        form tr.full,form tr.oldfm{width: 100%;height: auto;overflow: hidden;}
        form tr.mb0{margin-bottom: 0;}    
            form th,form td{
            width: 100%;
            height: auto;
            display: block;
            border: none;
            text-align: left;
            box-sizing: border-box;}
                form th {padding: 0;font-weight: normal;color: #000;}
                    form th p {color: #333;margin: 0;width: auto;}
                form td {padding: 5px 0 0 0;}
                    form td div {
                    width: 20%;
                    display: inline-block;
                    float: left;
                    margin-right: 3%;
                    }
                        form td div span {width: 85%;display: inline-block;margin-right: 5%;}
                    form td a {text-decoration: underline;color: #0B68AF;}
                    form td p {width: auto;color: #333;}
                form tr:last-child th, form tr:last-child td {width: auto;display: inline-block;padding: 0;}
                form tr:last-child th:after {content:none;}

        form tr.oldfm{display: flex;}
            form tr.oldfm th{width: 20%;display: inline-block;margin-right: 5%;}
            form tr.oldfm td{
            width: 50%;
            height: 70px;
            overflow: hidden;
            display: inline-block;
            line-height: unset!important;
            }
                form tr.oldfm td div {
                float: none;
                width: 100%;
                display: block;
                margin-top: -20px;
                }
                form tr.oldfm th span.your-old {width: 80%;display: inline-block;margin-right: 5%;}
                form tr.oldfm td span.radio {
                position: static;
                display: inline-block;
                width: 100%;
                height: auto;
                }
                form tr.oldfm td span.wpcf7-list-item.first {margin-left: 0!important;}
form .btn {margin-bottom: 20px;margin-right: -20px;padding: 0;}
.required:after {
content: "＊";
color: #0B68AF;
font-size: 12px;
margin-left: 5px;
}
div.wpcf7 .wpcf7-submit {
border: none;
background: transparent;
font-size: 14px;
color: #fff;
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 0 70px 0 80px;
transition: 0.3s;
}
div.wpcf7 .wpcf7-submit:disabled {opacity: 0.3;}
.wpcf7-submit:hover:before{opacity: 1;}


.wpcf7-form-control-wrap.checkbox1,.wpcf7-form-control-wrap.checkbox2 {width: 100%;display: block;text-align: left;}
.wpcf7-form-control-wrap.checkbox2 {margin-bottom: 20px;}
textarea.wpcf7-textarea{
-webkit-appearance:none;
-moz-appearance:none;
-ms-appearance:none;
-o-appearance:none;
appearance:none;
width: 100%;
height: 225px;
line-height: 40px;
box-sizing: border-box;
padding: 0 10px;
font-size: 12px;
border: none;
background-color: #F5F5F5;
}
input.wpcf7-text {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
width: 100%;
height: 45px;
line-height: 40px;
box-sizing: border-box;
padding: 0 10px;
font-size: 12px;
border: none;
background-color: #F5F5F5;
}
select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required {
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
border: none;
width: 100%;
height: 45px;
background-color: #F5F5F5;
padding-left: 20px;
}

/*-----------------------------------------------------------animation--*/
.txt_mask{
animation-name:txt_mask;
animation-duration: 1s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
}
.fade_in{
opacity: 0;
animation-name:fade_in;
animation-duration: 1s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
}

@-webkit-keyframes txt_mask {
    0% {width: 0%;}
    100% {width: 100%;}
}
@keyframes txt_mask {
    0% {width: 0%;}
    100% {width: 100%;}
}

@-webkit-keyframes fade_in {
    0% {transform: translateY(15px);opacity: 0;}
    100% {transform: translateY(0px);opacity: 1;}
}
@keyframes fade_in {
    0% {transform: translateY(15px);opacity: 0;}
    100% {transform: translateY(0px);opacity: 1;}
}

/*-------------------------------------------------------------*/
.contents_ttl{
width: 93%;
max-width: 980px;
margin: 0px auto;
height: auto;
overflow: hidden;
text-align: left;
}
.contents_ttl p.no {
width: auto;
float: left;
height: auto;
box-sizing: border-box;
padding-bottom: 5px;
border-bottom: 3px solid #000;
}
.contents_ttl p.txt{
font-size: 14px;
clear: both;
margin-top: 40px;
display: block;
width: 100%;
float: left;
line-height: 1.7em;
}
.ttl_move{
overflow: hidden;
width: 0;
animation-name:txt_mask;
animation-duration: 1s;
animation-delay: 0.3s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
}
.contents_ttl h2{
font-size: 24px;
font-family: "Hiragino Kaku Gothic Std W8";
float: left;
position: relative;
height: 40px;
width: 600px;
}
.contents_ttl h2 span{
color: #187FC4;
font-size: 14px;
font-family: "Hiragino Kaku Gothic ProN W6";
width: 100%;
height: 20px;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
.contents_ttl h2 span:before{
content: "";
width: 60px;
height: 1px;
background-color: #000;
display: inline-block;
margin: 5px 30px;
}

#page-top {
display: block;
width: 100%;
height: 200px;
box-sizing: border-box;
padding-top: 60px;
margin: 70px 0 95px 0;
background-color: #2979af;
background-repeat: no-repeat;
background-position: -2% center;
background-size: auto;
}
#archive_cases #page-top,#cases #page-top{background-image: url("images/cases_pagetop.png");background-position: 8% center;}
#archive #page-top,#single #page-top{background-image: url("images/news_pagetop.png");}
#service #page-top,#service_about #page-top{background-image: url("images/service_pagetop.png");background-position: -5% center;}
#archive_cases #page-top,#cases #page-top{background-image: url("images/cases_pagetop.png");background-position: 8% center;}
#contact #page-top{background-image: url("images/contact_pagetop.png");margin-bottom: 0;}
#company #page-top{background-image: url("images/com_pagetop.png");background-position: 2% center;padding: 60px 0 0 0;}
#page-top.plivacy_topimg{background-image: url("images/plivacy_pagetop.png");}
#page-top.disc_topimg{background-image: url("images/disc_pagetop.png");}
#page-top.saitemap_topimg{background-image: url("images/sitemap_pagetop.png");}
#page-top.message_topimg{background-image: url("images/message_pagetop.png")!important;margin-bottom: 0;}
.body-ir #ir #page-top{background-image: url("images/ir_pagetop.png")!important;}
.body-news #ir #page-top{background-image: url("images/ir_news_pagetop.png")!important;}
.body-highlight #ir #page-top{background-image: url("images/ir_hilight_pagetop.png")!important;}
.body-notification #ir #page-top{background-image: url("images/ir_notification_pagetop.png")!important;}
.body-library #ir #page-top,.body-settlement #ir #page-top,.body-securities #ir #page-top,.body-open #ir #page-top,.body-briefing #ir #page-top,.body-document #ir #page-top{background-image: url("images/ir_library_pagetop.png")!important;}
.body-corporate_coverage #ir #page-top{background-image: url("images/ir_corporate_coverage_pagetop.png")!important;}
.body-coverage #ir #page-top{background-image: url("images/ir_coverage_pagetop.png")!important;}
.body-calender #ir #page-top{background-image: url("images/ir_calender_pagetop.png")!important;}
.body-stock_info #ir #page-top{background-image: url("images/ir_stock_info_pagetop.png")!important;}
.body-faq_info #ir #page-top{background-image: url("images/ir_faq_info_pagetop.png")!important;}

#page-top h2{
width: 90%;
max-width: 900px;
margin: 0 auto;
height: auto;
font-size: 36px;
font-weight: bold;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
text-align: left;
color: #fff;
}
#page-top h2 span{
font-size: 12px;
font-weight: normal;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", メイリオ, Meiryo, sans-serif;
display: block;
}
#page-top h2 span.en_indoor{font-size:20px;}

.select_content {display: none;}
.select_content.active{display: block;}

.tal_link{
font-size:34px;
font-weight: bold;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
color: #0D8FE6;
pointer-events: none;}
.tal_link span{
font-size: 12px;
font-weight: normal;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", メイリオ, Meiryo, sans-serif;
color: #000;
display: block;
}
.tal_link i{font-size: 30px;margin-right: 7px;color: #000;}

.pagination {
width: 90%;
max-width: 980px;
height: 40px;
line-height: 40px;
margin: 80px auto;
text-align: center;
font-size: 24px;
font-weight: bold;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
display: block;
}
.nav-links {display: flex;justify-content: center;}
.nav-links span, .nav-links a {
margin: 0;
width: auto!important;
max-width: none;
display: block;
height: 40px;
line-height: 40px;
box-sizing: border-box;
padding: 0 15px;
background-color:transparent!important;
}
.nav-links span, .nav-links .next, .nav-links .prev {color: #187FC4;}
.nav-links .next {margin-left: 5px;line-height: 35px;}
.nav-links .next {margin-left: 5px;line-height: 35px;}

    .single_main p a,#privacy dd a,.com_linktxt a{
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    padding: 0 3px;
    }
    .com_linktxt a{width: 90%;}
    .single_main p a,#privacy dd a,.com_linktxt a,.case_about .r li a,#ir_about table tr td  a,#ir_faq dd a{text-decoration: underline;}
    .single_main p a:after,#privacy dd a:after,.com_linktxt a:after,.case_about .r li a:after,#ir_about table tr td  a:after,#ir_faq dd a:after{
    content: "";
    width: 15px;
    height: 15px;
    background-image: url(../jtower_theme4%20-%20Copy/images/link_ico.svg);
    background-repeat: no-repeat;
    background-position:center 100%;
    background-size: auto;
    display: inline-block;
    margin-left:3px;
    }


/*-------------------------------------------------------------news*/
.news{
width: 93%;
max-width: 980px;
height: auto;
overflow: hidden;
margin: 0 auto;
}
.news.archive {margin-bottom: 80px;}
    .news.archive ul {margin-bottom: 50px;}
.news ul li a.active{background-color: #187FC4;color: #fff; pointer-events: none;}
.news.select_area div.select_content.active{display: block;}
.news.select_area div.select_content{display: none;}

.news ul.yearly-list {margin:-40px 0 50px 0;max-width: 50%;display: flex;}
    .yearly-list li{
    line-height: 30px!important;
    margin-right: 3px;
    display: inline-block!important;
    }
        .yearly-list a {font-size: 10px;}
        .yearly-list a:after {content: "年";}
        .yearly-list li.active a {background-color: #187FC4;color: #fff;}

.news ul {
display: table;
table-layout: fixed;
text-align: center;
width: 100%;
position: relative;
}
    .news ul li {width: 35%;display: table-cell;font-size:12px;line-height: 40px;}
        .news ul li a {
        width: 100%;
        height: 100%;
        display: block;
        color: #000;
        background-color: #f0f0f0;
        }
        .news ul li.current-cat a,.news ul li.all a{background-color: #187FC4;color: #fff;opacity: 1;}
        .news ul li a:hover{background-color: #187FC4;color: #fff;opacity: 1;}
        .news ul li.all a.hide_yearly{color: #000;background-color: #f0f0f0;}
        
    .news div a {
    width: 100%;
    height: 60px;
    display: block;
    background-color: #fff;
    }
        .news div a:nth-child(even){background-color: #F7F7F7;}
            .news div a dl {
            width: 100%;
            height: auto;
            overflow: hidden;
            margin: 0;
            box-sizing: border-box;
            padding: 0 5%;
            }
                .news div a dl dt, .news div a dl dd {
                float: left;
                line-height: 60px;
                font-size: 14px;
                width: 70%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                }
                .news div a dl dt{width: auto;display: inline-block;margin-right: 20px;}
                    .news div a dl dt:nth-child(2){color:#187FC4;display: inline-block;}

.single_top,.single_main{width: 100%;max-width: 740px;margin: 0 auto;}
.single_top {border-bottom: 1px solid #000;box-sizing: border-box;padding-bottom: 30px;}
.single_main{margin: 80px auto;}
    .single_top dl {margin: 0 0 20px 0;font-size: 12px;}
        .single_top dt, .single_top dd {display: inline-block;}
            .single_top dd a {color: #187FC4;margin-left: 40px;}
    .single_top h1 {font-size: 30px;}

.single_main h1, .single_main h2{margin: 20px 0;}
.single_main p {
font-size: 14px;
line-height: 2em;
margin: 20px 0;
height: auto;
overflow: hidden;
}
    .single_main img {
    max-width: 100%;
    height: auto;
    pointer-events: none;
    }
    img.aligncenter {margin: 0 auto;display: block;}
    img.alignleft {float: left;}
    img.alignright {float: right;}

.news.single {box-shadow: 0px 3px 5px 2px rgba(0,0,0,0.17);}


#topics_slide {
width: 90%;
max-width: 980px;
height: 40px;
margin: 40px auto 0 auto;
box-shadow: 0px 3px 5px 2px rgba(0,0,0,0.17);
background-color: #fafafa;
}
#topics_slide div.ttl, #topics_slide ul {float: left;height: 40px;overflow: hidden;}
#topics_slide div.ttl {
width: 10%;
background-color: #000;
text-align: center;
color: #fff;
font-size: 12px;
line-height: 40px;
letter-spacing: 1px;
}
#topics_slide ul {width: 90%;}
#topics_slide ul li {
width: 100%;
display: inline-block;
box-sizing: border-box;
padding: 0 40px;
}
#topics_slide li a{line-height: 40px;font-size: 12px;}
#topics_slide li a:hover{opacity: 0.5;}
#topics_slide li span:last-of-type {color: #187fc4;margin-right:20px;}
#topics_slide p {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}


/*-------------------------------------------------------------service*/
#service h3 {
width: 90%;
margin: 0 auto 80px auto;
text-align: center;
font-size: 1.17em;
line-height: 2em;
}
#en #service h3 {font-size: 1.1em;}
#service .list {
background-color: #F4FAFF;
height: auto;
box-sizing: border-box;
padding: 120px 0 80px 0;
}
#service .contents {
width: 90%;
max-width: 900px;
margin: 0 auto 40px auto;
background-color: #fff;
box-sizing: border-box;
padding: 60px 50px;
box-shadow: 0px 3px 5px 2px rgba(0,0,0,0.17);
display: flex;
justify-content: space-between;
opacity: 0;
animation-name:fade_in;
animation-duration: 1s;
animation-delay: 0.3s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
}
    #service .contents .img {width: 350px;position: relative;}
        #service .contents .img img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 350px;
        height: auto;
        }
    #service .contents .txt {width: 420px;}
        #service .contents .txt p {display: block;font-size: 12px;margin: 15px 0 35px 0;}
        #service .contents .txt h1 {font-size: 1.17em;}
        #service .contents .txt h1 span{display: block;font-size: 12px;}
.service_dl{
width: 280px;
height: 40px;
line-height: 40px;
display: flex;
justify-content:flex-start;
color: #fff;
text-align: center;
margin: 0 0 20px 0;
}
#en #service .contents dl.service_dl{width: 100%;}
    .service_dl dt{
    width: 50%;
    height: 100%;
    background-color:#176192;
    font-size: 12px;
    }
    .service_dl dd{
    width: 50%;
    height: auto;
    overflow: hidden;
    background-color:#187fc4;
    font-size: 12px;
    }
    #service .contents:nth-of-type(2) dl dd {background-color: #053250;}
    
/*service/???*/
#service_about #page-top {margin-bottom: 0;}
    #service_about .top-area {
    width: 90%;
    max-width: 900px;
    height: auto;
    margin: 0 auto 70px auto;
    }
        #service_about .top-area .service_dl {margin-top: -20px;margin-bottom: 85px;}
        #en .indoor .service_dl {width: 500px;}
            .top-area.wifi dl dd {background-color: #053250;}
        #service_about .top-area div,#service_about .top-area img {width: 80%;margin: 0 auto;height: auto;}
            #service_about .top-area .txt {font-size: 12px;line-height: 2.5em;}
                #service_about .top-area .txt h3 {font-size: 24px;color: #187FC4;margin-top: 0;}
                    #service_about .top-area .txt h3 span {font-size: 12px;font-weight: normal;}
            #service_about .top-area img {margin: 0 auto 40px auto;display: block;}

.service_main {
width: 100%;
box-sizing: border-box;
padding: 100px 0;
height: auto;
overflow: hidden;
position: relative;
background-color: #F4FAFF;
}
    .service_main.indoor{background-color:transparent;}
    .service_main.indoor:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: #F4FAFF;
    top: 0;
    z-index: -1;
    }
    .service_main.indoor:after{
    content: "";
    width: 100%;
    height: 330px;
    position: absolute;
    background-color: #fff;
    bottom: 0;
    z-index: -1;
    }
.card_list {
width: 90%;
max-width: 900px;
margin: 80px auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.card {
width: 280px;
height: auto;
background-color: #fff;
box-sizing: border-box;
padding:25px 35px 35px 35px;
text-align: center;
font-size: 12px;
line-height: 2em;
margin: 0 0 30px 30px;
box-shadow: 0px 3px 5px 2px rgba(0,0,0,0.17);
}
.card:first-of-type,.card:nth-of-type(4){margin-left: 0;}
    .card .img {
    display: flex;
    justify-content: center;
    width: 100%;
    height: 160px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
    }
    .card.construction .img{background-image: url("images/indoor/indoor_construction.png");}
    .card.variousplace .img{background-image: url("images/indoor/indoor_variousplace.png");}
    .card.addition .img{background-image: url("images/indoor/indoor_addition.png");}
    .card.simplification .img{background-image: url("images/indoor/indoor_simplification.png");}
    .card.global .img{background-image: url("images/indoor/indoor_global.png");}
    .card.costdown .img{background-image: url("images/indoor/indoor_costdown.png");}
        .card.cloud .img{background-image: url("images/wifi/wifi_cloud.png");}
        .card.setting .img{background-image: url("images/wifi/wifi_setting.png");}
        .card.simultaneous .img{background-image: url("images/wifi/wifi_simultaneous.png");}
        .card.support .img{background-image: url("images/wifi/wifi_support.png");}
            .card.down .img{background-image: url("images/tower/tower_down.png");}
            .card.share .img{background-image: url("images/tower/tower_share.png");}
    
    .card .img img {height: auto;width: 230px;}
    .card p {margin: 20px 0 25px 0;height:auto;text-align: left;}
    .card span {
    font-size: 16px;
    display: block;
    margin-bottom: 10px;
    text-align: center;
    }
    .card_list.wifi .card span {text-align: left;}
        .card_list.wifi .card:nth-of-type(3) span {text-align: center;}

.needs {
height: 520px;
width: 100%;
max-width: 1050px;
margin: 0 auto;
position: relative;
}
.needs .img {
height: 520px;
width: 670px;
position: absolute;
left: 0;
top: 0;
bottom: 0;
margin: auto;
background-image: url(images/indoor/indoor_txt.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.needs p {
width: 475px;
height: 350px;
background-color: #fff;
box-sizing: border-box;
padding: 50px 40px;
box-shadow: 0px 3px 5px 2px rgba(0,0,0,0.17);
position: absolute;
right: 70px;
top: 0;
bottom: 0;
margin: auto;
font-size: 12px;
line-height: 2em;
}
#en .needs p {height: 450px;}
.needs p span {
font-size: 24px;
margin-bottom: 30px;
display: block;
color: #187FC4;
}

.service_second {
width: 100%;
height: auto;
background-color: #E9EFF4;
box-sizing: border-box;
padding: 100px 0;
}
.service_second .img{height: 110px;}
.service_second .img img {width: auto;height: 80px;margin-top: 25px;}

.card p.ttl {
text-align: center;
font-size: 15px;
line-height: normal;
height: auto;
margin-bottom: 0;
}
.card p.number {
margin: 0;
font-weight: bold;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
font-size: 40px;
line-height: normal;
height: auto;
text-align: center;
}
.card p.number span {
display: inline-block;
font-size: 20px;
margin-left: 5px;
margin-bottom: 0;
}
.card span.cap {font-size: 10px;margin-bottom: 0;}

/*feature*/
.service_list {
width: 100%;
display: block;
box-sizing: border-box;
padding: 100px 0;
}
.service_list .card_list .card {width: 40%;padding:20px 25px 30px 25px;margin: 0 0 20px 20px;}
.service_list .card_list .card.rocal {pointer-events: none;}
    .card.rocal .btn,.card.tower .btn {display: none;}
.service_list .card_list .card:first-of-type, .service_list .card_list .card:nth-of-type(3){margin-left: 0;}
.service_list .img {height: 200px;}
    .service_list .card_list .card .img{
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
    }
    .service_list .card_list .card.indoor .img{background-image: url(images/top_service_1.png);}
    .service_list .card_list .card.wifi-solution .img{background-image: url(images/top_service_2.png);}
    .service_list .card_list .card.site-locator .img {background-image: url(images/top_service_3.png);}
    .service_list .card_list .card.tower .img{background-image: url(images/top_service_4.png);}
    .service_list .card_list .card.rocal .img{background-image: url(images/top_service_5.png);}

/*feature*/
#service_about.feature .top-area {
margin: 90px auto;
height: auto;
position: relative;
overflow: visible;
}
#service_about.feature .top-area img {width: 70%;height: auto;float: left;}
#service_about.feature .top-area .txt {
box-sizing: border-box;
margin-bottom: 55px;
width: 100%;
padding-right: 30%;
}
.feature .top-area .box {
width: 100%!important;
display: flex;
padding-right: 30%;
justify-content: space-between;
box-sizing: border-box;
margin: 0!important;
}
    .feature .top-area .box ul{width: 47%;height: auto;margin: 0;text-align: center;}
        .feature .top-area .box ul li{font-size: 14px;text-align: left;line-height: 2em;}
            .feature .top-area .box ul li:first-child
            {
            width: 100%;
            height: 40px;
            line-height: 40px;
            display: block;
            text-align: center;
            margin: 20px auto;
            background-color: #E5E5E5;
            }
            .feature .top-area .box ul:last-child li:first-child{color: #fff;background-color: #0D8FE6;}
.side_area{
position: absolute!important;
top: 0!important;
right:0;
background-color: #f5fafd;
width: 250px!important;
font-size: 12px;
}
.side_area.smaller {position: sticky!important;top: 20%!important;float: right;}
    .side_area p{
    width: 100%;
    height: 40px;
    color: #fff;
    background-color: #000;
    box-sizing: border-box;
    padding: 0 20px;
    line-height: 40px;
    text-align: center;
    }
    .side_area ul{box-sizing: border-box;}
        .side_area ul li{width: 100%;height: auto;}
        .side_area ul li.this {background-color: #f1f1f1;}
            .side_area ul li a{
            height: 100%;
            width: 100%;
            display: inline-block;
            padding: 10px 30px 10px 20px;
            box-sizing: border-box;
            }
            .side_area ul li a:hover{opacity: 1;background-color: #0D8FE6;color: #fff;}
                .side_area ul li.this a{pointer-events: none;}
            .side_area ul li a:after{
            content: ">";
            color: #0D8FE6;
            float: right;
            transition: 0.3s;
            margin-right: -10px;
            }
            .side_area ul li a:hover:after{color: #fff;}
            .side_area ul li.this a:after{content: none;}
                .side_area li p {
                background-color: transparent;
                color: #000;
                text-align: left;
                padding: 0;
                width: 90%;
                float: left;
                line-height: 40px;
                }
                 .side_area li p.twoline{line-height: normal;}

/*-------------------------------------------------------------cases*/
#page-top.case h2 {margin: 0;}
.case .contents_ttl {max-width: 800px;}
#archive .case_area {margin-top: 0;}
#case {
display: block;
width: 100%;
height: auto;
overflow: hidden;
background-color: #fafafa;
}

.cases_listarea {
width: 90%;
max-width: 980px;
margin: 0 auto;
}
.case_catlist p {font-size: 10px;margin-bottom: 5px;color: #333;}
.case_contents{display: none;height: auto;}

.case_catlist {width: 980px;margin: 0 auto 100px auto;}
.catlist_box {
width: 100%;
height: auto;
overflow: hidden;
position: relative;
}
.catlist_box .all {
width: 7%;
font-size: 10px;
float: left;
position: absolute;
top: 0;
bottom: 0;
left: 0;
}
.catlist_box .all a{
width: 100%;
height: 100%;
color: #fff;
background-color: #000;
transition: none;
text-align: center;
display: flex;
justify-content: center;
flex-direction: column;
box-sizing: border-box;
border-right: 1px solid #fff;
}
.catlist_box .all a.active{background-color: #187FC4;color: #fff;pointer-events: none;}

.case_catlist ul{
display: flex;
flex-wrap: wrap;
-webkit-flex-wrap: wrap;
-ms-flex-flow: row wrap;
text-align: center;
width: 93%;
margin-left: 7%;
}
.case_catlist ul li {
width: 25%;
font-size: 10px;
line-height: 40px;
box-sizing: border-box;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
.case_catlist ul li a {
width: 100%;
height: 100%;
display: block;
color: #000;
background-color: #f0f0f0;
transition: none;
}
.case_catlist ul li.current-cat a, .case_catlist ul li.all a,.case_catlist ul li.current-cat-parent a{background-color: #000;color: #fff;}

.case_catlist ul.child {margin-top: 20px;margin-left: 0!important;display: flex;width: 100%;}
.case_catlist ul.child li {width: 15%; padding: 0;height: 40px;}
    .case_catlist ul.child li:last-child{margin-right: 0;}
.case_catlist ul.child li a {font-size: 10px;}
.case_catlist ul.children {display: flex;}

.case_archive {
width: 100%;
height: auto;
display: flex;
flex-wrap: wrap;
}
    .case_item{
    margin-bottom: 4%;
    width: 300px;
    opacity: 0;
    animation-name:fade_in;
    animation-duration: 1s;
    animation-timing-function: ease-out;
    animation-fill-mode: forwards;
    }
    .case_item:nth-of-type(2), .case_item:nth-of-type(5), .case_item:nth-of-type(8), .case_item:nth-of-type(11) {
    margin-left: 4%;margin-right: 4%;}
        .case_item a{width: 100%;height: 100%;display: block;}
        .case_item a div {
            width: 100%;
            height: 185px;
            position: relative;
            overflow: hidden;
            margin-bottom: 10px;
            background-color: #fff;
            background-size: contain;
            background-repeat: no-repeat;
        }
             .case_item a p.ttl{
            width: 100%;
            color: #187FC4;
            font-weight: bold;
            font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
            font-size: 12px;
            }
             .case_item a .cat {
            width: 100%!important;
            position: absolute;
            top: 0px;
            text-align: right;
            display: table;
            margin-left: 0!important;
            }
                .case_item a .cat li {
                font-size: 10px;
                margin-bottom: 1px;
                text-align: right;
                display: list-item;
                background-color: transparent;
                }
                    .case_item a .cat li span{
                    background-color: #000;
                    display:inline-block;
                    color: #fff;
                    width: auto;
                    padding: 0 5px;
                    font-size: 10px;
                    }
                    .case_item a p.date{width: 100%;font-size: 10px;margin-top: 5px;}
 
#cases {background-color: #FAFAFA;}
 
 .cases_wrapper {
width: 90%;
max-width: 980px;
margin: 0 auto;
display: block;
height: auto;
}
 
.case_img {
width: 100%;
height: auto;
overflow: hidden;
margin: 0 auto;
display: flex;
justify-content: center;
}
.case_img img {
height: 100%;
}
.case_img.noimg {background-color: #fff;}
    .case_img.noimg img {width: auto;height: auto;top: 0;}
.img_cap {
position: absolute;
bottom: 10px;
left: 0px;
font-size: 12px;
width: auto;
background-color: #000;
color: #fff;}
.case_about{width: 100%;height: auto;}
    .case_about .inner{
    width: 93%;
    max-width: 980px;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    box-sizing: border-box;
    padding: 50px 0;
    }
        .case_about .l {
        width: 40%;
        height: 100%;
        float: left;
        box-sizing: border-box;
        padding-right: 30px;
        }
            .case_about .l dl {border-bottom: 1px solid #dedede;padding: 0 0 10px 0;width: 80%;}
            .case_about .l p a,.case_about .l dl dt,.case_about .l dl dd {font-size: 12px;color: #187FC4;pointer-events: none;}
                .case_about .l dl dd {margin-left: 10px;}
            .case_about .l h1 {font-size: 24px;margin-bottom: 10px;}
        .case_about .r {width: 60%;height: 100%;float: left;}
            .case_about .r ul {margin: 0;display: flex;flex-wrap: wrap;}
                .case_about .r li {width: 50%;font-size: 12px;margin-bottom:20px;margin-right: 0!important;}
                .case_about .r li.caption{width: 100%;font-size: 10px;color: #000;}
                    .case_about .r li p{color: #187FC4;    width: 100%;}
                
 /*sp-size*/
.cases_wrapper.sp_layout .case_img{width: 50%;float: left;margin-bottom: 100px;}
.cases_wrapper.sp_layout .case_img img {height: 100%;width: auto;left:auto;}
.cases_wrapper.sp_layout .case_img p.img_cap {left:auto;right: 0;}
    .cases_wrapper.sp_layout .case_about .inner{
    max-width: none;
    width: 50%;
    height: 510px;
    box-sizing: border-box;
    padding: 70px 0 0 65px; 
    margin: 0;
    }
        .cases_wrapper.sp_layout .case_about .inner .l {
        width: 100%;
        height: auto;
        float: none;
        display: block;
        margin-bottom: 40px;}
        .cases_wrapper.sp_layout .case_about .inner .r {width: 100%;float: none;display: block;}

.cases_under {
background-color: #fff;
margin-top: 80px;
box-sizing: border-box;
padding-top: 80px;
}
.cases_under .case_archive {margin-top: 60px;}
.cases_under .cat {bottom: inherit!important;top: 10px;}
.cases_under .date {font-size: 10px;}

/*-------------------------------------------------------------customers_interview*/
#page-top-recruit.customers_interview_top{background-image: url(images/top_customers_interview.png);}
.customers_interview_list .img img{
height: 100%;
width: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.customers_interview_list .name{
color: #0B68AC;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
font-size: 16px;
}
.customers_interview_list .about{
font-size: 14px;
color: #000;
}

.customers_interview_checked_posts{
margin-bottom: 100px;
margin-top: 0;
padding-top: 0;
}
.customers_interview_checked_posts .contents_ttl {width: 100%;max-width: inherit;}
.customers_interview_checked_posts .case_item{margin-bottom: 0;}
.mt50{margin-top: 50px;}

.customers_interview_section_name{
width: 100%;
color: #0B68AC;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
font-size: 14px;
margin-bottom: 30px;
line-height: inherit;
}

#customers_interview_cases{
width: 100vw;
height: auto;
background-color: #FAFAFA;
padding-top: 60px;
}
#customers_interview_cases_img{
width: 100%;
height: auto;
overflow: hidden;
margin: 0 auto;
display: flex;
justify-content: center;
}
    #customers_interview_cases_img img{height: 100%;}
#customers_interview_cases dl{
width: 90%;
max-width: 980px;
height: auto;
margin: 0 auto;
padding: 60px 0;
display: flex;
flex-wrap: wrap;
}
#customers_interview_cases dl dt,#customers_interview_cases dl dd{width: 50%;}
#customers_interview_cases_name{
font-size: 24px;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
margin-bottom: 10px;
line-height: 1.3em;
}
#customers_interview_cases_about{
font-size: 12px;
color: #0B68AC;
line-height: 2em;
}
#customers_interview_cases ul li{font-size: 12px;margin-bottom: 10px;}
    #customers_interview_cases ul li span {
    width: 125px;
    display: inline-block;
    padding-left: 35px;
    box-sizing: border-box;
    }

#customers_interview_ttllead{
width: 90%;
max-width: 980px;
height: auto;
margin: 0 auto;
padding: 40px 0;
}
#customers_interview_ttl{
font-size: 24px;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
line-height: 1.6em;
color: #0B68AC;
}
#customers_interview_lead{
width: 100%;
height: auto;
padding: 40px;
margin-top: 55px;
background-color: #FAFAFA;
font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
font-size: 20px;
line-height: 2em;
box-sizing: border-box
}

#customers_interview_interviewee{
width: 100vw;
height: auto;
background-color: #FAFAFA;
padding: 40px 0;
}
    #customers_interview_interviewee .inner{
    width: 90%;
    max-width: 980px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    }
    #customers_interview_interviewee .customers_interview_section_name {margin-bottom: 0;}
    #customers_interview_interviewee dl{
    width: 50%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    }
        #customers_interview_interviewee dl dt{
        width: 150px;
        height: 150px;
        border-radius: 50%;
        overflow: hidden;
        background-color: #909090;
        }
        #customers_interview_interviewee dl dd{
        padding:40px 0 0 40px;
        font-size: 14px;
        line-height: 2em;
        }

.customers_interview_contents{
width: 100vw;
height: auto;
overflow: hidden;
padding: 60px 0;
}
.customers_interview_contents:nth-of-type(2n-1){background-color: #fafafa;}
    .customers_interview_contents dl,.customers_interview_contents .inner{
    width: 90%;
    max-width: 980px;
    height: auto;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: left;
    }
        .customers_interview_contents dl dt,.customers_interview_contents dl dd{
        width: 50%;
        overflow: hidden;
        position: relative;
        box-sizing: border-box;
        }
            .customers_interview_contents dl img{
            width: auto;
            height: 100%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            }
            .customers_interview_contents .ttl{
            font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
            font-size: 20px;
            line-height: 2em;
            margin-bottom: 20px;
            width: 100%;
            }
            .customers_interview_contents .txt{font-size: 14px;line-height: 2em;}

#customers_interview_contents_right.customers_interview_contents dl dt{order: 2;background-color: #909090;}
#customers_interview_contents_left.customers_interview_contents dl dd{padding-left: 60px;}
#customers_interview_contents_right.customers_interview_contents dl dd{padding-right: 60px;}

#customers_interview_postscript{
width: 100vw;
height: auto;
margin: 0 auto;
}
#customers_interview_postscript:before, #customers_interview_postscript:after {
width: 100%;
height: 2px;
content: "";
display: block;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAACFJREFUKFNjZCASMELV/YfSMD6GdpIVEnQATqvQdQ4rhQCzdwILWIJnogAAAABJRU5ErkJggg==);
background-repeat: repeat-x;
background-size: 4px;
}
    #customers_interview_postscript dl{
    display: flex;
    width: 90%;
    max-width: 980px;
    height: auto;
    margin: 60px auto;
    }
        #customers_interview_postscript dl dt {
        text-align: center;
        font-size: 14px;
        color: #0B68AC;
        margin-bottom: 25px;
        }
        #customers_interview_postscript dl dd{padding: 30px 0 0 45px;}
#customers_interview_postscript dl dd .customers_interview_section_name {margin-bottom: 10px;}
#customers_interview_postscript_img{
width: 170px;
height: 170px;
border-radius: 50%;
overflow: hidden;
margin-bottom: 20px;
background-color: #909090;
}
#customers_interview_postscript_txt{font-size: 14px;line-height: 2.14em;}

/*-------------------------------------------------------------company*/
#company section {box-sizing: border-box;padding: 100px 0;}

.com_value p {width: 90%;max-width: 940px;margin: 0 auto;text-align: center;}
    .com_value p.copy {
    font-size: 35px;
    font-weight: bold;
    font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
    margin: 90px auto 70px auto;
    margin-bottom: 25px;
    }
        #en .com_value p.copy{font-size: 32px;}
    .com_value p.txt {font-size: 14px;line-height: 2.4em;}

#com_movie_open {
width: 90%;
max-width: 700px;
height: auto;
margin: 80px auto 0 auto;
display: block;
position: relative;
overflow: hidden;
}
#com_movie_open:hover{opacity: 1;}
#com_movie_open:before {
content: "";
width: 90px;
height: 90px;
border-radius: 50%;
border: 5px solid #fff;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
z-index: 1;
}
    #com_movie_open i {
    width: 25px;
    height: 45px;
    text-align: center;
    font-size: 60px;
    line-height: 45px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    right: 0;
    margin: auto;
    color: #fff;
    transform: scaleX(1.4);
    z-index: 1;
    }
    #com_movie_open img {
    width: 100%;
    height: auto;
    display: block;
    transition: 0.3s;
    }
    #com_movie_open:hover img{transform: scale(1.07);}
#com_movie_pop {
display: none;
text-align: center;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 700px;
height: 500px;
margin: auto;
z-index: 999;
}
#com_movie_pop:after {
content: "";
width: 100vw;
height: 100vh;
position: fixed;
z-index: -1;
background-color: rgba(0,0,0,0.3);
top: 0;
left: 0;
}
    #com_movie_pop .inner {
    width: 100%;
    height: auto;
    display: inline-block;
    position: relative;
    padding: 12px;
    box-sizing: border-box;
    background-color: #fff;
    box-shadow:0px 2px 5px 3px rgb(0 0 0 / 20%);
    }
        #com_movie_close {
        background-color: #fff;
        width: 42px;
        height: 42px;
        text-align: center;
        padding-top: 4px;
        box-sizing: border-box;
        border-radius: 50%;
        position: absolute;
        top: -18px;
        right: -15px;
        box-shadow: 0px 2px 5px 3px rgb(0 0 0 / 10%);
        }
        #com_movie_close:before, #com_movie_close:after {
        content: "";
        height: 3px;
        width: 25px;
        background-color: #000;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        }
        #com_movie_close:before {transform: rotate(45deg);}
        #com_movie_close:after {transform: rotate(-45deg);}
        #com_movie_pop .inner video {
        width: 100%;
        height: auto;
        display: block;
        }

#com_tab{
display: table;
table-layout: fixed;
text-align: center;
width: 90%;
max-width: 980px;
margin: 0 auto;
position: relative;
}
    #com_tab li{
    width: 22%;
    display: table-cell;
    font-size: 12px;
    line-height: 40px;
    }
        #com_tab li a{
        width: 100%;
        height: 100%;
        display: block;
        color: #000;
        background-color: #f0f0f0;
        }
        #com_tab li.active a{
        background-color: #187FC4;
        color: #fff;
        opacity: 1;
        }

.com_tab_content{
display: none;
width: 90%;
max-width: 980px;
margin: 0 auto;
}
.com_tab_content.active{display: block;}
    .com_tab_content .contents_ttl,.com_tab_content table{width: 100%;max-width: inherit;}

    .com_management ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 100px auto 0 auto;
    }
    .com_management li p.type{font-size: 14px;color:#0D8FE6;}
    .com_management li p.name{
    display: block;
    font-size: 24px;
    font-weight: bold;
    font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
    margin: 15px 0;
    }
    .com_management li p.name span{
    font-size: 10px;
    font-weight: normal;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", メイリオ, Meiryo, sans-serif;
    display: block;
    }
    .com_management li p.cap{font-size: 12px;line-height: 1.8em;}
    .com_management table {width: 100%;margin: 30px 0 0 0;}
        .com_management th, .com_management td {
        height: auto;
        padding: 0 0 10px 0;
        font-size: 12px;
        color: #000;
        }
        .com_management th {border: none;width: 20%;}
        .com_management td {border: none;width: 70%;}

        .com_management ul.director1 li{width: 50%;height: auto;display: table-cell;}
            .com_management ul.director1 li.img_box {
            width: 45%;
            height: 350px;
            display: inline-block;
            margin-right: 5%;
            }
                .com_management ul.director1 li.img_box img,.com_management ul.director2 li.img_box img{width: 100%;height: auto;}
        
        .com_management ul.director2 li{
        width: 100%;
        height: auto;
        overflow: hidden;
        margin-bottom: 100px;
        }
            #company section.com_management ul.director2 li dl dt {
            margin-right: 6%;
            width: 30%;
            overflow: hidden;
            }
                #company section.com_management ul.director2 li dl dt img {
                display: block;
                width: 100%;
                height: auto;
                }
            #company section.com_management ul.director2 li dl dd {width: 64%;}
.director2 .btn_area{text-align: left;padding-left: 10px;margin: 30px 0;}        

.com_access {text-align: center;margin: 0 auto;}
.com_access .contents_ttl {margin-bottom: 75px;}
    .com_access_box {
    width: auto;
    height: auto;
    display: block;
    margin-bottom: 85px;
    }
    .com_access_box .map {
    height: 370px;
    width: 100%;
    background-color: #eee;
    margin: 10px 0;
    }
.com_access_box span {
width: 100%;
display: block;
text-align: left;
color: #0D8FE6;
font-size: 14px;
}
.com_access_box p {display: block;text-align: left;font-size: 12px;}
#company section dl {margin: 0;display: flex;flex-wrap: wrap;}
#company section dt {
    width: 20%;
    color: #727272;
    font-size: 12px;
}
#company section dd{width: 80%;color: #333333;}
#company section .com_pro_table_en dt {width: 40%;}
#company section .com_pro_table_en dd {width: 60%;}

.message_area {padding: 0!important;}
.message_img {
width: 100%!important;
height: 500px!important;
max-width: none!important;
margin: 0 auto!important;
}
.message_area div {
display: flex;
justify-content: center;
flex-wrap: wrap;
overflow: hidden;
}
.message_name {justify-content: flex-end!important;}
.message_name img{width: auto;height: 40px;}
#en article div.message_name p {font-size: 10px;margin-bottom: 0!important;}
#en  article div.message_name h4 {margin: 0;font-size: 20px;}

    .message_area .message_img img {height: 100%;width: auto;}
    .message_area div.message_img p {
    width: 80%;
    max-width: 800px;
    height: auto;
    position: absolute;
    top: 35%;
    text-shadow: 2px 0px 3px rgba(0,0,0,0.5);
    left: -10%;
    right: 0;
    margin: auto;
    text-align: left;
    font-size: 24px;
    line-height: 2em;
    color: #fff;
    font-family: "Yu Mincho", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif;
    }
    #en section.message_area div.message_img p {font-size: 20px;}
    
    .message_img {position: relative;}
    .message_area p ,.message_area div{
    width: 90%;
    max-width: 600px;
    height: auto;
    margin: 80px auto;
    font-size: 14px;
    line-height: 2em;
    letter-spacing: 1px;
    }
.message_area div p {
line-height: inherit;
margin: 0 0 10px 0;
text-align: right;
width: 100%;
}

/*-------------------------------------------------------------sitemap*/
#map_menu {
width: 90%;
max-width: 900px;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
}
#map_menu dl {margin: 0 0 40px 0;width: 30%;}
#en #map_menu dl:first-of-type {width: 10%;}

#map_menu dl dt{margin-bottom: 5px;}
    #map_menu dl dt:after {
    content: "";
    display: block;
    width: 80%;
    height: 1px;
    background-color: #0D8FE6;
    margin: 10px 0;
    }
    #map_menu dl dt a{font-size: 14px;}
#map_menu dl dd{margin-bottom: 3px;}
    #map_menu dl dd.mb{margin-bottom: 30px;}
    #map_menu dl dd a{font-size: 12px;font-weight:lighter;}
    #map_menu dl dd div a{font-size: 12px;font-weight:lighter;}
#map_menu li {margin-left: 20px;}
#map_menu li:first-of-type {margin-left: 0;}
#map_menu li:last-of-type {margin-bottom: 20px;}

#map_menu .ir_list li,#map_menu .contact_list li {margin-left: 0;}

.page_item .children {box-sizing: border-box;padding-left: 20px;}

/*-------------------------------------------------------------contact*/
#contact .top_txt {
font-size: 16px;
line-height: 2em;
text-align: center;
width: 100%;
height: auto;
display: block;
margin-top: 100px;
}
    #contact .tal_link{
    font-size: 46px;
    font-weight: bold;
    font-family: "ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro W6", メイリオ, Meiryo, sans-serif;
    display: block;
    margin: 50px auto;
    }
    
.contact_formarea {
text-align: center;
background-color: #FFF;
box-sizing: border-box;
padding: 100px 0;
}
.contact_formarea .contents_ttl {margin-bottom: 100px;}

/*-------------------------------------------------------------privacy*/
#privacy p,.ir_policy p{
width: 90%;
max-width: 900px;
margin: 0 auto;
line-height: 2em;
font-size: 14px;
}
#privacy dl,.ir_policy dl{
width: 90%;
max-width: 900px;
height: auto;
overflow: hidden;
margin: 70px auto;
}
    #privacy dt,.ir_policy dt{font-size: 24px;display: block;margin-bottom: 20px;}
        #privacy dd,.ir_policy dd{font-size: 14px;line-height: 2em;}
           /*#privacy dd a{color:#0D8FE6;text-decoration: underline;}*/
#privacy ul{padding-left: 20px;}
    #privacy ul li {list-style: initial;}

/*-------------------------------------------------------------404*/
#not section {margin-top: 70px;}
#not p {
width: 90%;
max-width: 900px;
margin: 0 auto;
font-size: 14px;
line-height: 2em;
}


/*--
    add 2021.10
----------------------*/

/*-------------------------------------------------------------general*/

.page-inner {
    width: 90%;
    max-width: 980px;
    margin: 0 auto;
}
.page-inner--m {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

.headline-03 {
    margin: 45px 0 20px;
    padding-left: 30px;
    font-size: 16px;
    font-weight: bold;
    color: #0B68AC;
    position: relative;
    z-index: 1;
}
.headline-03:first-child {
    margin-top: 0;
}
.headline-03::before {
    content: '';
    width: 20px;
    height: 1px;
    margin: auto;
    display: block;
    background-color: #000;
    position: absolute;
    top: 0;
    left: 0;
    right: auto;
    bottom: 0;
    z-index: 2;
}
.headline-03 ~ .headline-03 {
    margin-top: 50px;
}
.headline-04 {
    margin: 0 0 15px;
    font-size: 16px;
    font-weight: bold;
}

.tab-nav {
    display: table;
    table-layout: fixed;
    text-align: center;
    width: 100%;
    margin: 0 auto;
    position: relative;
}
.tab-nav li{
    width: 33.3%;
    display: table-cell;
    font-size: 12px;
    line-height: 40px;
}
.tab-nav li a{
    width: 100%;
    height: 100%;
    display: block;
    color: #000;
    background-color: #f0f0f0;
}
.tab-nav li.active a{
    background-color: #187FC4;
    color: #fff;
    opacity: 1;
}

.tab-content{
    display: none;
    width: 100%;
}
.tab-content.active {
    display: block;
}
.tab-content .contents_ttl,
.tab-content table {
    width: 100%;
    max-width: inherit;
}

/*-------------------------------------------------------------governance*/
#governance {}
#governance #page-top{
    background-image: url("images/governance_pagetop.png");
    background-position: left center;
    padding: 60px 0 0 0;
}
#governance section {
    box-sizing: border-box;
    padding: 100px 0;
}
.governance-content {
    margin-top: 75px;
}
.governance-content p {
    font-size: 14px;
    line-height: 1.714;
}
.governance-img {
    margin-top: 40px;
}
.governance-img img {
    width: 100%;
    height: auto;
    display: block;
}
.governance-img p {
    margin-bottom: 10px;
}


/*-------------------------------------------------------------en_news*/
#en .news ul.yearly-list {
    margin: 0 0 50px;
}
#en .yearly-list a:after {
    content: none;
}




/*-------------------------------------------------------------responsive*/
@media screen and (max-width:960px) {

    /*--
    add 2021.10
    ----------------------*/

    /*-------------------------------------------------------------en_news*/
    #en .news div a dl dt,
    #en .news div a dl dd {
        max-width: 60%;
    }
}


@media screen and (max-width:860px) {
article {margin-top: 60px;}
.sp {display: block!important; }.hide{display: none!important;}

.contents_ttl h2 {margin:0px;width: 85%;}
.contents_ttl h2 span {margin-left: 20px;}
.contents_ttl h2 span:before{display: none;}
.contents_ttl p.txt {width: 100%;}
#page-top{margin: 60px 0;height: 120px;padding-top: 40px!important;}
    #page-top h2 {font-size: 24px;}

.news div a dl dt:nth-child(2) {display: none!important;}
.news ul li {width: 35%!important;}
#topics_slide div.ttl {width: 20%;font-size: 10px;}
#topics_slide ul {width: 75%;}
#topics_slide ul li {padding: 0 10px;}
#topics_slide p {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.yearly-list {margin: -20px 0 30px 0;max-width: 100%;}
.news ul li {font-size: 10px;}
.news div a dl dd {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 72%;
}
.news div a dl dt {font-size: 10px!important;margin-right: 10px!important;}
.single_top h1 {font-size: 5vw;}
.single_top, .single_main {width: 90%;max-width: none;margin: 30px auto;}

#service h3 {font-size: 5vw;text-align: left;}
#service .contents {padding: 30px;}
    #service .contents .img {width: 35%;margin-bottom: 30px;}
    #service .contents .txt{width: 60%;}
    
#service_about #page-top h2 {font-size: 14px;}
#service_about .top-area {max-width: none;}
    #service_about .top-area .txt h3 {font-size: 18px;}
    #service_about .top-area .service_dl {margin-bottom: 45px;}
    #service_about .top-area .txt {width: 60%;}
    #service_about .top-area .img {width: 30%;}
        #service .contents .img img {width: 100%;height: auto;}
.card {width: 100%!important;margin: 0 auto 30px auto!important;text-align: left;}
    .card .img {
    width: 50%;
    display: inline-block;
    float: left;
    margin-right: 3%;
    }
    .card h4 {width: 40%;display: inline-block;margin-bottom: 40px;}
    
    .card p {text-align: center;height: auto;}
.needs {max-width: unset;}
    .needs .img {height: 320px;width: 470px;margin: unset;}
    .needs p {right: 0;}

#service_about.feature .top-area {width: 90%;margin: 60px auto 80px auto;}
.service_second .card .img {height:auto;text-align: center;}
.service_second .card p, .service_second .card span.cap {width: 40%;display: inline-block;text-align: left;}
.side_area.smaller, .side_area {
position: static!important;
display: block;
float: none;
margin: 0 auto 60px auto!important;
width: 100%!important;
}
.side_area p {height: 30px;line-height: 30px;}
.side_area ul {display: flex;flex-wrap: wrap;padding:0 0 10px 0;}
#service_about.feature .top-area .txt,#service_about .top-area div, #service_about .top-area img{padding-right: 0;}
#service_about .top-area img {float: none!important;margin: 0 auto 40px auto;}

.select_area{padding: 0;margin: 70px auto;float: none;}
.select_area .select_list li {
width: 100%;
display: inline-block;
float: left;
font-size: 12px;
}
.case_contents ul {display: block;}
.case_archive {width: 100%!important;}
.case_contents {
height: auto!important;
margin: 0 auto;
overflow: hidden;
max-height: none!important;
}
.case_item {display: block;margin: 0 auto 4% auto;}
.case_img.sp_size {
width: 300px;
height: 350px;
margin: 0 auto;
float: none;
}
.case_about .l, .case_about .r {width: 100%;float: none;display: block;}
.case_about .l {margin-bottom: 20px;}
.case_about .l h1 {font-size: 20px;}

.case_catlist {width: 90%;margin-bottom: 40px;}
.catlist_box .all {width: 100%;height: 40px;line-height: 40px;position: static;}
    .case_catlist ul {width: 100%;display: flex;flex-wrap: wrap;margin-left: 0;}
    .case_catlist ul li {width: 100%;}
        .case_catlist ul.child {width: 100%;}
            .case_catlist ul.child li {
            width: 50%;
            margin: 0;
            height: 30px;
            line-height: 30px;
            }

#customers_interview_cases{padding-top:0;}
#customers_interview_cases_img {height: auto;}
#customers_interview_cases_img img {width: 100%;height: auto;}
#customers_interview_cases dl{padding: 30px 0;}
#customers_interview_cases dl dt, #customers_interview_cases dl dd,.customers_interview_contents dl dt,.customers_interview_contents dl dd{width: 100%;}
#customers_interview_cases_about {margin-bottom: 12px;}
#customers_interview_cases ul li span {padding-left: 0;width: 90px;}
#customers_interview_ttl {font-size: 20px;}
#customers_interview_lead {
padding: 20px;
font-size: 16px;
line-height: 1.8em;
margin-top: 20px;
}
#customers_interview_interviewee .inner {justify-content: space-between;padding: 0;}
#customers_interview_interviewee dl {justify-content: center;}
    #customers_interview_interviewee dl dd {padding: 20px 10px;}
#customers_interview_contents_left.customers_interview_contents dl dd,#customers_interview_contents_right.customers_interview_contents dl dd{padding:20px 0 0 0;order: 3;}
#customers_interview_contents_left.customers_interview_contents dl dt,#customers_interview_contents_right.customers_interview_contents dl dt { height: 200px;}
#customers_interview_postscript dl {flex-wrap: wrap;justify-content: center;}
#customers_interview_postscript dl dd {padding: 0;}


.com_value p.copy,#en .com_value p.copy{text-align: left;}
.com_value p.txt {font-size: 12px;text-align: left;}
#com_tab li {
display: block;
width: 100%;
border-bottom: 3px solid #fff;
}
.com_tab_content table {margin-top: 35px;}

.com_management ul {display: block;}
    .com_management li {
    width: 100%!important;
    margin-bottom: 60px!important;
    height: auto!important;}
    .com_management li:last-of-type{margin-bottom: 0!important;}
        .com_management th, .com_management td {display: table-cell;}
.message_area p, .message_area div {margin: 10% auto;}
.message_img {height: 300px!important;}
    .message_area div.message_img p {max-width: none;font-size: 18px;}

#contact section .top_txt {font-size: 12px;}
#contact .top_txt {width: 90%;margin:60px auto 0 auto;font-size: 12px;}
.contact_formarea {padding: 60px 0;width: 90%;margin: 0 auto;}
.contact_formarea .contents_ttl {margin-bottom: 40px;width: 100%;}
.contents_ttl h2 {
margin: 0px;
width: 100%;
height: auto;
float: none;
overflow: hidden;
}
.contents_ttl h2 span {
margin-left: 0px;
position: static;
display: block;
font-size: 12px;
}
form p {width: 100%;}
table th, table td {
width: 100%;
display: block;
height: auto;
padding: 15px 0;
}

#contact .tal_link {font-size: 30px;margin: 25px auto;}
#contact .tal_link i {font-size: 25px;}
form tbody {display: block;}
    form tr {width: 100%;display: block;}
        form th, form td {width: 100%;display: block;padding: 0;font-size: 10px;}
input.wpcf7-text {width: 100%;}

#contact .tab_select a {box-sizing: border-box;padding: 10px;line-height: normal;}

#map_menu{display: block;}
#map_menu dl{width: 100%!important;}
#map_menu li {margin-bottom: 5px;}

.top_img_box img {left: -50%;}

}


@media screen and (max-width:480px) {
a:hover{opacity: 1!important;}
#page-top {background-size: 120%;}

#topics_slide li a:hover{opacity: 1;}
.news ul.yearly-list {max-width: 100%;}
#archive .news div a {height: auto;}
#archive .news div a dl {padding: 10px 5%;}
#archive .news div a dl dt,#archive .news div a dl dd {line-height: inherit;}
#archive .news div a dl dt {display: block;float: none;}
.news div a dl dd {font-size: 12px;}
#archive .news div a dl dd {
height: auto;
width: 100%;
float: none;
text-overflow: inherit;
white-space: inherit;
margin-top: 5px;
font-size: 12px;
}

#service .contents {display: block;}
    #service .contents .txt {width: 100%;text-align: center;margin-bottom: 20px;}
        #service .contents .txt h1, #service .contents .txt p {text-align: left;}
    #service .contents .img{width: 100%;height:150px; display: block;}
 
.service_dl{width: 100%;}
#en .service_dl, #en .service_dl dt, #en .service_dl dd {display: block;width: 100%!important;height: auto;}
    #service_about .top-area .txt {width: 100%;margin-bottom: 30px;}
    #service_about .top-area .img {width: 100%;}
  
#service_about.feature .top-area {width: 90%;margin: 60px auto;}
    #service_about.feature .top-area img {width: 100%;}
    .feature .top-area .box {width: 100%;display: block;}
        .feature .top-area .box img {width: 100%;}
        .feature .top-area .box ul {width: 100%;margin-bottom: 40px;}
            #en .feature .top-area .box ul li:first-child {font-size: 13px;}
.side_area, .side_area.smaller {position: static;float: none;width: 100%;}

.card {width: 100%;text-align: center;}
    .card .img {
    width: 100%;
    float: none;
    margin-right: 0;
    background-size: contain!important;
    }
    .card h4 {width: 100%;display: block;font-size: 18px;}
.service_second .card p, .service_second .card span.cap {width: 100%;display: block;text-align: center;}
    
.needs {height: auto;}
    .needs .img {position: static;margin-bottom: 30px;}
    .needs p {position: static;width: 90%;height: auto!important;}
    .needs p span {font-size: 4.5vw;}
    
.case_img {height: 210px;}
.case_about .l dl{width: 100%;}

#company #page-top {margin-bottom: 0;}
#company section {box-sizing: border-box;padding: 60px 0;}
.com_value p.copy,#en .com_value p.copy{font-size: 7.5vw;margin: 40px auto;}
#com_movie_pop {width: 320px;height: 200px;}
    #com_movie_pop .inner {padding: 6px;}
.com_management li img {width: 100%!important;}
#company section dt {width: 40%;}
#company section dd {width: 50%;}
#en #company section dt, #en #company section dd {width: 50%;}
.message_img {height: 30vh!important;}
    .message_area div.message_img p {
    max-width: none;
    font-size: 4vw;
    width: 50%;
    right: initial;
    left: 5%!important;
    top: 10%;
    }

form tr.oldfm th {width: 50%;}


    /*--
        add 2021.10
    ----------------------*/

    /*-------------------------------------------------------------general*/

    .tab-nav li{
        display: block;
        width: 100%;
        border-bottom: 3px solid #fff;
    }

    .headline-03 {
        margin: 35px 0 15px;
    }
    .headline-03 ~ .headline-03 {
        margin-top: 30px;
    }
    .headline-04 {
        margin: 0 0 10px;
    }

    /*-------------------------------------------------------------governance*/
    #governance {}
    #governance #page-top{
        /* margin-bottom: 0; */
    }
    #governance section {
        box-sizing: border-box;
        padding: 60px 0;
    }
    .governance-content {
        margin-top: 35px;
    }
    .governance-content p {
        /* font-size: 14px;
        line-height: 1.714; */
    }
    .governance-img {
        /* margin-top: 40px; */
    }
    .governance-img p {
        /* margin-bottom: 10px; */
    }
    .governance-content .btn_area {
        width: 85%;
        margin: 40px auto;
    }
    .governance-content .btn_area .btn {
        padding: 0 30px 0 15px;
        font-size: 10px;
    }

    /*-------------------------------------------------------------en_news*/
    #en .news div a dl dt,
    #en .news div a dl dd {
        max-width: inherit;
    }

}