/*--------------------------------------------------------------
	style_toko / Kasai Sayaka 2018
--------------------------------------------------------------*/
@charset "utf-8";

@font-face {
    font-family: "NotoSansCJKjp";
    font-style: normal;
    font-weight: normal;
    /*   src: url('../font/web/NotoSansCJKjp.eot');*/
    src: /*url('../font/web/NotoSansCJKjp.eot?#iefix') format('embedded-opentype'),
         url('../font/web/NotoSansCJKjp.woff') format('woff'),*/
    url('assets/font/NotoSansMonoCJKjp-Regular.otf') format('opentype');
}

body {
    font-family: 'W3', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', 'sans-serif', 'NotoSansCJKjp';
    font-size: 16px;
    color: #000;

    /* text-align: justify;  */
    /* text-justify: inter-ideograph; */
    word-break:normal;
    /* word-break:break-all; */
}

.caption-content,
.module-subtitle {
    text-align: left;
    color: #000;
}

.col-x-centering,
.col-centering { /* 左右センタリング */
    text-align: center;
}

.col-right {
    text-align: right;
}

.col-middle { /* 上下左右センタリング */
    display: flex;
    align-items: center;
    justify-content: center;
}

.col-md-hidden {
    display: none;
}
/* Title */
.module-title {
    letter-spacing: 3px;
}

h3.module-title {
    margin-bottom: 35px;
    word-break: break-word;
}

.module-title + .module-subtitle {
    margin-top: 0;
}

.en {
    color: #595757
}

.no-gutter > [class*="col-"] {
    padding-right:0;
    padding-left:0;
} 

.br_visible_sp{
    display: none;
}

@media screen and (max-width:767px) { /*　767px(size xs)以下　*/

.br_visible_sp{
    display: block;
}
}

/* Area */
.row-eq-height { /* 横並びボックスの高さを揃える */
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: box;
    display: flex;
    /*   flex-wrap: wrap;*/ /* !Ban! */
}

.module {
    padding: 40px 0;
    padding: 70px 0;
}

.section-nega {
    background: #00478A;
    color: #fff;
}

    .section-nega div,
    .section-nega .module-title {
        color: #fff;
    }
/*
.scroll-up{
	right:35px;
	bottom:35px;
}*/
.btn,
.scroll-up a {
    padding: 1em 1.5em;
    font-size: 1.2em;
    font-family: inherit;
}

.scroll-up a {
    height: auto;
    width: auto;
    border: 1px solid rgba(0, 0, 0, 0.75);
    border-radius: 0;
    background: rgba(255, 255, 255, 0.5);
}

    .scroll-up a:hover,
    .scroll-up a:active {
        background: rgba(255, 255, 255, 0.6);
    }

.btn.btn-border-w,
.btn.btn-border-w:visited,
.btn.btn-border-w:focus {
    background: rgba(255, 255, 255, 0.2);
    background: #496aa1;
    border: 1px solid rgba(255, 255, 255, 0.75);
    color: #fff;
}

    .btn.btn-border-w:hover,
    .btn.btn-border-w:active {
        background: rgba(255, 255, 255, 0.4);
        background: #768fb8;
        border: 1px solid rgba(255, 255, 255, 0.75);
        color: #fff;
    }

.btn-border-none,
.btn.btn-border-none:visited,
.btn.btn-border-none:focus,
button.btn-border-none,
button.btn.btn-border-none:visited,
button.btn.btn-border-none:focus {
    width: 320px;
    background: #00478A;
    color: #fff;
    opacity: 1;
}

.btn.btn-border-none:hover,
.btn.btn-border-none:active,
button.btn.btn-border-none:hover,
button.btn.btn-border-none:active {
    color: #fff;
    opacity: .8;
}
.text_link {
    color: #00478A;
    text-decoration: underline;
}

#btn_main .btn {
    font-size: 1em;
}

    #btn_main .btn.btn-border-w,
    #btn_main .btn.btn-border-w:visited,
    #btn_main .btn.btn-border-w:focus {
        background: rgba(255, 255, 255, 0.5);
        border: 1px solid #666;
        color: #666;
    }
/* GrobalNavigationArea */
.navbar-custom {
    background: #fff;
    border-bottom: #dedede 1px solid;
    font-family: inherit;
}
/* サイト表示時のナビ
.navbar-transparent{
	background:none;
	border-bottom:none;
}*/
.navbar-brand {
    padding: 9px 15px;
}

.navbar-custom .nav li > a {
    /*    font-weight: bold;*/
    font-size: 14px;
    color: #000;
}

.navbar-custom .navbar-toggle .icon-bar {
    background: #000;
}

.navbar-custom .nav > li > a:focus, .navbar-custom .nav > li > a:hover, .navbar-custom .nav .open > a, .navbar-custom .nav .open > a:focus, .navbar-custom .nav .open > a:hover, .navbar-custom .dropdown-menu > li > a:focus, .navbar-custom .dropdown-menu > li > a:hover {
    color: #00478A;
    font-weight: bold;
}
/* MainVisualArea */
.home-section,
.bg-gradient {
    height: 580px;
}

.home-section {
    background: url('../../assets/images/main.jpg') 50% top;
}
/* messageArea */
#message h2 {
    margin-bottom: 25px;
}

#message .btn {
    margin-top: 10px;
}

#message_02 h3:first-child {
    color: #00478A;
}

.message_01_left strong,
.message_01_right strong {
    position: relative;
    display: inline-block;
    padding: 0 8em 0 0;
}

    .message_01_left strong:after,
    .message_01_right strong:after {
        content: '';
        position: absolute;
        top: 50%;
        display: inline-block;
        width: 8em;
        height: 1px;
        background-color: #fff;
    }

#btn_message_01 {
    margin-bottom: 70px;
}
/* businessArea */
#business {
    background: #292a2f;
    padding-bottom: 0;
}

@media all and (-ms-high-contrast:none) {
    #business_01 img,
    #business_02 img,
    #business_03 img {
        width: 220px;
    }
    /* IE10 */
    *::-ms-backdrop,
    #business_01 img,
    #business_02 img,
    #business_03 img {
        width: 220px;
    }
    /* IE11 */
}

_:-ms-lang(x), _::-webkit-meter-bar,
#business_01 img,
#business_02 img,
#business_03 img {
    width: 220px;
}
/* Edge */

#business h2 {
    color: #fff;
}

#business_01 h3,
#business_02 h3,
#business_03 h3 {
    margin-top: 35px;
}

#business_01 { /* #0c0f32 */
    background: #0c0f32 url('../../assets/images/business_bg_01.jpg') no-repeat right 50%;
}

    #business_01 .row > div,
    #business_02 .row > div,
    #business_03 .row > div {
        background: #fff;
        background: rgba(255, 255, 255, 0.94);
    }

    #business_01 h3 {
        color: #00478A;
    }

#business_02 {
    background: #fafafa url('../../assets/images/business_bg_02.jpg') no-repeat left 50%;
}

    #business_02 h3 {
        color: #0C93A4;
    }

#business_03 {
    background: #abb1ad url('../../assets/images/business_bg_03.jpg') no-repeat right 50%;
}

#business_01,
#business_02,
#business_03 {
    background-size: auto 100%;
    /*	padding:0;*/
}

    #business_03 h3 {
        color: #4B4848;
    }
/* planArea */
#plan h2.module-title,
#plan h3 {
    color: #00478A;
}
/*#plan h3 {
    font-size: 18px;
}*/
/* companyArea */
#company dt,
#company dd {
    margin-top: 2em;
}

    #company dt:first-child,
    #company dd:nth-child(2),
    #company dd:nth-child(3) {
        margin-top: 0;
    }

#company dt {
    color: #00478A;
}
/*
#company{
	background:url('../../assets/images/company.jpg');
	background-size:auto 100%;
}*/
/* accesstArea */
.module#access {
    padding-bottom: 0;
    font-size: 14px;
}

#access img {
    margin: 40px 0 20px;
}

#access .module-title {
    margin-bottom: 30px;
}

#access h4 {
    /*	font-weight:bold;*/
}

#gglmap {
    width: 100%;
    height: 500px;
}

#access_map {
    width: 100%;
    padding: 0;
}

footer.section-nega {
    background: #292a2f;
    font-size: 0.8em;
}

#noscript_mes {
    display: block;
    margin: 0;
    padding: 1.2em;
    color: #fff;
    background: #666;
    font-size: 1.2em;
    border: #fff solid 1px;
    text-align: center;
}
html,body, main{height:100%;}
.main {
    width: 100%;
    position: relative;
    height: auto !important; /*IE6対策*/
    height: 100%; /*IE6対策*/
    min-height: 100%;
}
#contact {
    padding-bottom: 62px;
}
.footer {
    width: 100%;
    height: 62px;
    padding: 20px 0;
    position: absolute;
    bottom: 0;
}
/* privacy policy Area */
#privacy.home-section,
#contact.home-section {
    background: none;
    height: initial;
}

.page-single h2 {
    margin-top: 70px;
}

#privacy .container.privacy {
    padding: 90px;
    border: #666 solid 1px;
}

    #privacy .container.privacy h3 {
        margin: 2.5em 0 1em;
        padding: 0.3em 0;
        font-size: 18px;
        border-bottom: #666 solid 1px;
    }

        #privacy .container.privacy h3:first-child {
            margin-top: 0;
        }

    #privacy .container.privacy ol {
        margin-block-start: 0;
    }

        #privacy .container.privacy ol > li {
            margin-top: 1em;
        }




/* contactArea */
/*.module#contact {
    padding-bottom: 0;
}*/

.module#contact h2 {
    /*    font-size: 2.1em; */
}

.module#contact h3 {
    margin-bottom: 0.5em;
    font-size: 2.125em;
}

.module#contact .f-group > div {
    font-size: 1.25em;
}

    .module#contact .f-group > div:first-child {
        text-align: right;
}

#contact label,
#contact input {
    font-size: 1.2em;
}

.flex {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    --flex-grid: 12;
}

.step {
    margin-bottom: 90px;
}

    .step ul:after {
        content: "";
        position: absolute;
        top: 13px;
        left: 0;
        width: 100%;
        height: 1px;
        border-bottom: 1px solid #707070;
        z-index: 40;
    }

    .step ul li {
        list-style: none;
        background-color: #fff;
        z-index: 50;
    }

        .step ul li span {
            padding: 0 15px;
            padding-left: 60px;
            font-size: 22px;
        }

            .step ul li span.active {
                padding: 0 15px;
                padding-left: 60px;
                font-size: 22px;
                color: #0092e9;
            }

.flex.justify-space-between {
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.flex.align-center {
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.step ul li:first-child span {
}

    .step ul li:first-child span:before {
        width: 51px;
        height: 40px;
        background-size: 40px 40px;
        background-position: 10px 0;
    }

    .step ul li:first-child span:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 23px;
        height: 20px;
        background-image: url('../../assets/images/t_buddy_step1_off.svg');
        background-repeat: no-repeat;
        background-size: 18px 18px;
        background-position: 5px 2px;
    }

    .step ul li:first-child span.active:before {
        background-image: url('../../assets/images/t_buddy_step1_on.svg');
    }

.divider-w {
    border-top: 1px solid #707070;
}

#contact label {
    font-weight: 400;
}

#contact input[type="checkbox"] {
    display: none;
}

    #contact input[type="checkbox"] + label {
        background-image: url('../../assets/images/t_buddy_check_off_pc.svg');
        background-repeat: no-repeat;
        background-size: 20px 20px;
        padding-left: 30px;
        background-position: 0 10px;
    }

    #contact input[type="checkbox"]:checked + label {
        background-image: url('../../assets/images/t_buddy_check_on_pc.svg');
    }

#contact input,
#contact textarea {
    width: 100%;
    border: 1px solid #838485;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 400;
}

    #contact input[type='text'] {
        height: 44px;
    }

#contact textarea {
    height: 160px;
}

#contact .f-group {
    margin-bottom: 50px;
}

#contact .f-required,
#contact .f-optional {
    margin: 0 0.8em;
    font-size: 0.65em;
    display: inline-block;
    color: #fff;
    background-color: #b90b0b;
    padding: 1px 10px;
}

#contact .f-optional {
    background-color: #222c47;
}

#contact .error {
    font-size: 1.25em;
    color: #b90b0b;
}

#contact img {
    margin: 40px 0 20px;
}

#contact .module-title {
    margin-bottom: 30px;
}

#contact h4 {
    /*	font-weight:bold;*/
}

/*
#contact a {
    color: #0050C8;
    text-decoration: underline;
}
.btn_back,
button[type="submit"],
.btn_totop {
    margin: 0 15px;
    display: inline-block;
    background-color: #fff;
    color: #0092e9;
    border: 2px solid #0092e9;
    width: 380px;
    height: 80px;
    font-size: 20px;
    font-weight: 700;
    line-height: 76px;
    border-radius: 40px;
    text-decoration: none;
    opacity: 1;
    text-align: center;
    box-sizing: border-box;
    position: relative;
    cursor: pointer;
}*/

button[type="submit"][disabled] {
    cursor: initial;
    color: #ccc;
    border: 2px solid #ccc;
}

/*.btn_back {
    color: #DD4C4C;
    border: 2px solid #DD4C4C;
}*/

.g-recaptcha {
    width: 300px;
    margin: 0 auto;
    text-align: center;
}

#contact .contact_num:first-child {
    display: inline;
}
.f-group-child {
    margin-left: 2em;
    padding-left: 1.5em;
    background: url('../../assets/images/cb_branch.svg') no-repeat left 5px;
}

#contact .contact_num input {
    width: 2em;
    margin: 0 0.2em;
}
#contact #cb_const04_01 {
    width: 10em;
}

#contact .f-group-child {
    margin-bottom: 2em;
}

/* MediaQuery */
@media screen and (max-width:767px) { /*　767px(size xs)以下　*/
    #business_01 .row-eq-height, #business_02 .row-eq-height, #business_03 .row-eq-height { /* 横並びボックス解除 */
        -ms-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .navbar-custom .nav li > a { /* Gnavi増加 */
        font-size: 16px;
    }

    .navbar-nav > li > a {
        line-height: inherit;
        font-size: 16px;
    }
    .navbar-nav > li:first-child > a {
        border-top: 1px solid rgba(73, 71, 71, 0.15);
    }

    #message_02 img {
        margin-bottom: 2em;
    }

    .message_01_left strong,
    .message_01_right strong {
        padding: 0 3em 0 0;
    }

        .message_01_left strong:after,
        .message_01_right strong:after {
            width: 3em;
        }

    #business_01 .row-eq-height,
    #business_02 .row-eq-height,
    #business_03 .row-eq-height {
        padding-top: 70px;
    }

    #company dd,
    #company dd:nth-child(2),
    #company dd:nth-child(3) {
        margin-top: 0.5em;
    }
}

@media screen and (max-width:992px) { /*　992px(size sm)以下　*/
    .navbar-custom .nav li > a { /* Gnavi増加 */
        font-size: 12px;
    }
    #message_02 .row-eq-height { /* 横並びボックス解除 */
        -ms-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .main_caption {
        display: none;
    }

    .col-md-hidden,
    .col-md-hidden div {
        display: block;
        padding: 0;
        max-height: 350px;
        overflow: hidden;
    }

    #business_01,
    #business_02,
    #business_03 {
        background: none;
        padding: 0;
    }
    /*   .module-subtitle:last-child{
        margin-bottom:0;
    }*/
    #message_02 img {
        max-width: 100px;
        width: 100px;
        margin-bottom: 2em;
    }

    .message_01_left .module-subtitle {
        margin-bottom: 0;
    }
    /* planArea */
    #plan .message_01_right {
        /*font-size: 18px;*/
        margin-top: 40px;
    }

    .module#contact .f-group > div:first-child {
        text-align: left;
    }
}

@media screen and (min-width:992px) {
    #message_01 h3,
    .message_01_left {
        padding-right: 30px;
    }

    .message_01_right {
        padding-left: 30px;
    }

    #business_01 .row > div:nth-child(2),
    #business_02 .row > div:nth-child(2),
    #business_03 .row > div:nth-child(2) {
        padding-right: 30px;
    }
}

@media screen and (min-width:1120px) {
}



 /* Sustainability */
 .banner_sus{
    width:384px;
    margin-bottom:20px;
  }
  
  .banner_sus_caption{
    font-size: 2.4rem;
    color:#004780;
    font-weight: bold;
    line-height: 1.5;
  }
  
  .h2--extend{
    margin-top: 100px;
  }
  

  .logo_sus{
    width:600px;
    margin-top:150px;
    margin-bottom: 68px;
   }

  @media screen and (max-width:1280px) { /*　1025px(size sm)以下　*/

    .h2--extend{
        margin-top: 150px;
      }


}

@media screen and (max-width:1200px) { /*　1025px(size sm)以下　*/

   .logo_sus{
    margin-top:200px;
   } 

}



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

    .h2--extend{
        margin-top: 100px;
    }
    .logo_sus{
        margin-top:100px;
       } 

}


a img {
    border:none;
    vertical-align:top;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
    }
    a:hover img {
    opacity: 0.7;     /* 透過レベル */
    filter: alpha(opacity=80);
    }


    
@media screen and (max-width:1025px) { /*　1025px(size sm)以下　*/
    .main_caption--extend {
        display: none;
    }
}


.sdgs-top-section {
    background: url(../../assets/images/bg_sus.jpg) 50% top;
    height: 720px;
}


@media screen and (max-width:768px) { 
.sdgs-top-section {
    background: url(../../assets/images/bg_sus_sp.jpg) 50% -70px;
    height: 650px;
}
}


.h2-sdgs{
    color: white;
    font-size: 30px;
    margin-top: 30px;
    margin-bottom: 30px;
    font-weight: bold;
}


.caption-content-sdgs {
    text-align: left;
    color: #fff;
}
.caption-content-sdgs {
    display: table-cell;
    vertical-align: top;
    text-align: center;
}

.text-white{
    color:white;
}

.sdgs_div_margin{
    margin-left:142px;
    margin-right:142px;

}

.sdgs_div_margin2{
    margin-left:120px;
    margin-right:120px;

}


.section-sdgs-intro{
    background:black;
    color:white;
    padding-bottom: 40px;
}

.section-sdgs-main{
    background:#9AA09C;
}

.sdgs-main-inner{
    background: white;
    margin-top: -50px;
    margin-bottom: 100px;
    padding: 10px;
}

.h3-sdgs{
    background : #004780;;
    color:white;
    padding:20px 15px ;
    font-size: 30px;
}

.h4-sdgs{
    font-weight : bold;
    font-size : 30px;
    color : #004780;
    font-size: 30px;
    padding: 20px 0px 30px;
    
}

.sdgs-icon{
    width:140px;
    margin: 0px 15px 15px 0px;
}

.sdgs-photo{
    width:346px;
    margin: 0 0 5px;
}

.sdgs_p{
    margin-top:15px;

}


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

.divider-sdgs {
    border-top: 1px solid black;
    margin: 40px 0 20px;
}



.sdgs-fukidasi {
    position: relative;
    width: 600px;
    background-image: url(../images/sdgs-fukidasi_bg.png);
    background-size: 100%;
    background-repeat: no-repeat;
    padding: 25px 0 80px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 100px;
    margin-top: 60px;
}

.sdgs_link p{
    line-height: 1.5;
    margin-top: 15px;
    font-size: 1.5rem;
}
.sdgs_link div{
    margin-bottom: 50px;
}

.sdgs_journal{
    display: flex;align-items: flex-end;justify-content: flex-end;
    margin-top: -50px;
    font-weight : bold;
    font-size : 30px;
    color : #008000;
}

.sdgs_journal a{
    color : #008000;
}


.tokkon_sdgs{
    width:80%;
margin:auto;
margin-bottom:0px !important;
}

.tokkon_sdgs div{
margin-bottom:0px !important;
padding: 10px;

}

.tokosdgs{
margin:100px 0 50px;
}
.tokosdgs img{
    width:112px;
}

.domesticoverseas-title{
  font-size : 22px;
  color : #004780;
  text-align: center;
}
.nobori{
    padding: 10px 0;
}

.sdgs03_name{
    line-height: 1.2;
    display: block;
}

@media screen and (max-width:992px) { /*　768px(size sm)以下　*/

    .sdgs_div_margin{
        margin-left:-15px;
        margin-right:-15px;
    }
    
    .sdgs_div_margin2{
        margin-left:-15px;
        margin-right:-15px;
    
    }
    
    .sdgs-icon{
        width: 50%;
        padding: 5px;
        margin:0;
    }
    
    .sdgs-photo{
        width:100%;
    }
}


@media screen and (max-width:768px) { /*　768px(size sm)以下　*/

    .sdgs-fukidasi {
        width: 100%;
        margin-bottom: 30px;
        margin-top: 60px;
        padding: 20px 0 80px;
        background-image: url(../images/sdgs-fukidasi_bg_sp.png);
        background-size: 100%;
        background-repeat: no-repeat;
    }
        
.sdgs_journal{
    margin: 0px;
    font-size: 12px;
}


.tokkon_sdgs{
    width:100%;
margin:auto;
margin-bottom:0px !important;
}

.tokkon_sdgs div{
    padding: 5px;
    
    }
    .tokosdgs{
        margin:180px 0 50px;
        }

        .sdgs03_name{
text-align: center;
        }
        
}


.modal-video {
    background-color: rgba(0,0,0,0.8);

}

.js-modal-btn{
    cursor:pointer;
}

.modal-video-body {
    max-width: 1040px !important;
}


#group2 dt{
    margin-top: 2em !important;
}

#group2 dd{
    margin-top: 2em !important;
}

.groupGreen{
    color: #1d939d !important;
}

.groupBlack{
    color:#000 !important;
}

#group h4{
    font-weight: bold;
}

.world_map{
background: url("../images/world_map.jpg") no-repeat;
background-position: top 0 right 0;
background-size:cover;
padding-bottom: calc(120%*1365/2048);/* calc(100*ImageHeight/ImageWidth)% */
}

.sdgs_p{
    text-align: left;
}
.y-sdgs_logo{
    margin-top:20px;
    margin-bottom: 30px;
    width: 70%;
}

.y-sdgs_link{
text-align: left;
    font-size:1.3rem;
}

.y-sdgs_link a{
    color:blue;
}

.divider-h{
    border-right: 1px solid #707070;
}

.contact_logo{
    width:80%;
}

.contact_logo2{
    width:70%;
}

@media screen and (max-width:768px) { /*　768px(size sm)以下　*/
    #group2 dd{
        margin-top: 0.5em !important;
    }

    .divider-h{
        border-right: 0px solid #707070;
    }
    

}