@charset "UTF-8";

.p-top .l-wrap{
    background: url("../../images/business/top_bg.png") no-repeat center -100px;
    background-attachment: fixed;
    background-size: cover;
}

.p-top .p-topmv{
    height: 393px;
    padding-top: 99px;
}

.p-top .p-topmv-bh{
    margin: 0 auto 20px;
    overflow: hidden;
    line-height: 0;
    text-indent: -9999px;
    background: url("../../images/business/top_bh_title.png") no-repeat 0 0;
    width: 761px;
    height: 175px;
}

.p-top .p-topmv-lead{
    font-size: 1.8rem;
    line-height: 1;
    letter-spacing: 0.25em;
    text-align: center;
}

.p-top .p-topnav{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 1040px;
    margin: 0 auto 100px;
}

.p-top .p-topnav-item{
    width: 500px;
    height: 410px;
    margin-bottom: 40px;
}

.p-top .p-topnav-item a,
.p-top .p-topnav-item .p-topnav-disable{
    display: block;
    width: 500px;
    height: 410px;
    border-radius: 4px;
    color: #35bac4;
    box-shadow: 0 0 10px rgba(0,0,0,0.04);
    position: relative;
    overflow: hidden;
}

.p-top .p-topnav-item .p-topnav-disable-mask{
    position: absolute;
    left: 0;
    top: 0;
    width: 500px;
    height: 410px;
    background: url("../../images/common/img_coming.png") no-repeat 141px 187px rgba(0,0,0,0.56);
}

.p-top #p-topnav-item1 a:hover,
.p-top #p-topnav-item2 a:hover,
.p-top #p-topnav-item3 a:hover,
.p-top #p-topnav-item4 a:hover{
    background-color: #575757;
    opacity: 1;
    color: #fff;
}

.p-top #p-topnav-item1 a,
.p-top #p-topnav-item1 .p-topnav-disable{
    background: url("../../images/business/top_btn_img01.png") no-repeat 0 0 #fff;
}

.p-top #p-topnav-item2 a,
.p-top #p-topnav-item2 .p-topnav-disable{
    background: url("../../images/business/top_btn_img02.png") no-repeat 0 0 #fff;
}

.p-top #p-topnav-item3 a,
.p-top #p-topnav-item3 .p-topnav-disable{
    background: url("../../images/business/top_btn_img03.png") no-repeat 0 0 #fff;
}

.p-top #p-topnav-item4 a,
.p-top #p-topnav-item4 .p-topnav-disable{
    background: url("../../images/business/top_btn_img04.png") no-repeat 0 0 #fff;
}

.p-top .p-topnav-item-cover{
    height: 240px;
    border-radius: 4px 4px 0 0;
}

.p-top a:hover .p-topnav-item-cover{
    background: linear-gradient(45deg, rgba(53,186,196,0.5), rgba(25,118,189,0.5));
}

.p-top .p-topnav-item-block{
    height: 170px;
}

.p-top .p-topnav-item-eng{
    margin: 29px 0 5px 30px;
    height: 26px;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    text-indent: -9999px;
}

.p-top #p-topnav-item1 .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title01.png") no-repeat 0 0;
}

.p-top #p-topnav-item2 .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title02.png") no-repeat 0 0;
}

.p-top #p-topnav-item3 .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title03.png") no-repeat 0 0;
}

.p-top #p-topnav-item4 .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title04.png") no-repeat 0 0;
}

.p-top #p-topnav-item1 a:hover .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title01_on.png") no-repeat 0 0;
}

.p-top #p-topnav-item2 a:hover .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title02_on.png") no-repeat 0 0;
}

.p-top #p-topnav-item3 a:hover .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title03_on.png") no-repeat 0 0;
}

.p-top #p-topnav-item4 a:hover .p-topnav-item-eng{
    background: url("../../images/business/top_mh_title04_on.png") no-repeat 0 0;
}

.p-top .p-topnav-item-mh{
    font-size: 1.8rem;
    line-height: 1;
    letter-spacing: 0.13em;
    font-weight: bold;
    margin: 0 30px 15px;
}

.p-top .p-topnav-item-text{
    font-size: 1.6rem;
    line-height: 1.6;
    letter-spacing: 0.1em;
    margin: 0 30px;
    color: #575757;
}

.p-top a:hover .p-topnav-item-text{
    color: #fff
}


/* Smartphone Styles
============================================================================ */

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

.p-top .l-wrap{
    background: none;
}

body::before {
  content: "";
  background: url("../../images/business/top_bg.png") no-repeat center top;
  background-size: 200%;
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: -1;
}

.p-top .p-topmv{
    height: auto;
    padding-top: 0;
}

.p-top .p-topmv-bh{
    margin: 0 auto 15px;
    background: url("../../images/business/top_bh_title_sp.png") no-repeat 0 0;
    background-size: 100%;
    width: 91.33vw;
    height: 33.87vw;
}

.p-top .p-topmv-lead{
    font-size: 1.7rem;
    line-height: 1.4;
    margin-bottom: 40px;
}

.p-top .p-break{
    display: block;
}
    
.p-top .p-topnav{
    display: block;
    width: 100%;
    margin: 0 auto;
    padding: 4vw;
}

.p-top .p-topnav-item{
    width: 100%;
    height: auto;
    margin-bottom: 35px;
}

.p-top .p-topnav-item .p-topnav-disable-mask{
    background-position: 27.6vw 35.73vw;
    background-size: 36.8vw;
}

.p-top .p-topnav-item a,
.p-top .p-topnav-item .p-topnav-disable{
    width: 100%;
    height: auto;
    min-height: 78.67vw;
}

.p-top #p-topnav-item1 a,
.p-top #p-topnav-item2 a,
.p-top #p-topnav-item3 a,
.p-top #p-topnav-item4 a,
.p-top #p-topnav-item1 .p-topnav-disable,
.p-top #p-topnav-item2 .p-topnav-disable,
.p-top #p-topnav-item3 .p-topnav-disable,
.p-top #p-topnav-item4 .p-topnav-disable{
    background-size: 100%;
}

.p-top .p-topnav-item-cover{
    height: 44.13vw;
}

.p-top .p-topnav-item-block{
    height: auto;
    min-height: 34.67vw;
}

.p-top .p-topnav-item-eng{
    margin: 4vw;
    height: 4vw;
}

.p-top #p-topnav-item1 .p-topnav-item-eng,
.p-top #p-topnav-item2 .p-topnav-item-eng,
.p-top #p-topnav-item3 .p-topnav-item-eng,
.p-top #p-topnav-item4 .p-topnav-item-eng,
.p-top #p-topnav-item1 a:hover .p-topnav-item-eng,
.p-top #p-topnav-item2 a:hover .p-topnav-item-eng,
.p-top #p-topnav-item3 a:hover .p-topnav-item-eng,
.p-top #p-topnav-item4 a:hover .p-topnav-item-eng{
    background-size: contain;
}

.p-top .p-topnav-item-mh{
    font-size: 1.7rem;
    line-height: 1;
    margin: 0 4vw 2vw;
}

.p-top .p-topnav-item-text{
    font-size: 1.7rem;
    line-height: 1.5;
    margin: 0 4vw;
}

}/* Smartphone Styles END */