@charset "utf-8";

bodY{
    min-width: 1064px;
}
*{
    box-sizing: border-box;
}
a:hover{
    opacity: 0.9;
}
#container{
    background-color: #f5f5f5;
}
/*------------------------------------------------------------
	ヘッダー 260128
------------------------------------------------------------*/
#gHeader {
    padding: 39px 0 0px;
    background: url(img/common/h_line.jpg) repeat-x left top 7px #fff;
    border-bottom: none;
}
#gHeader .hBox--special {
	display: flex;
    width: 924px;
}

#spe_head_navbox{
    background: url(img/special/netz/nav_bg.png) repeat-x;
    filter: drop-shadow(0px 2px 2px rgba(0,0,0,0.2));
}
#spe_head_nav{
    width:924px;
    margin: 0 auto;
}
#spe_head_nav ul{
    display: flex;
}
#spe_head_nav ul li{
    width: 145px;
    border-left:1px solid #fff;
}
#spe_head_nav a{
    display: block;
    text-align: center;
    height: 40px;
    line-height: 40px;
    color: #fff;
}
#spe_head_nav .apply{
    background-color: #ff0000;
    width: 182px;
}
#spe_head_nav .simulation{
    background-color: #ff6f00;
    width: 182px;
}
#spe_head_nav .mypage{
    background-color: #83da25;
    width: 120px;
    border-right:1px solid #fff;
}
/* sp menu */
@media screen and (max-width: 767px) {
    body{
        min-width: inherit;
    }
    #gHeader{
        height: 76px;
        padding-top: 24px;
    }
    #gHeader .hBox--special{
        width: 100%;
    }
    .hBox--special .logo{
        width:131px;
        margin: 14px 0 0 14px;
    }
    .hBox--special ul{
        display: flex;
    }
    .hBox--special ul li img{
        width:100%;
    }
    .hBox--special ul li.li_1{
        width: 67px;
    }
    .hBox--special ul li.li_2{
        width: 46px;
    }
    .hBox--special ul li.li_3{
        width: 64px;
        margin-right: 40px;
    }
    /* ナビ高さが異なるため、ハンバーガーメニューを調整*/
    .menu {
        top:38px;
        right:10px;
    }
    .menuBox{
        top:76px;
    }
    .menuBox li a, .menuBox li span{
        background-color: #008dff;
        color: #fff;
        border-bottom: 1px solid #fff;
    }
    .menuBox li li a, .menuBox li li span{
        background-color: #005ab4;
    }
    .menuBox li .accordion{
        background: url(img/special/netz/icon_p.png) no-repeat center center;
        background-size: 100%;
        width: 21px;
        height: 21px;
    }
    .menuBox li .accordion.on{
        background: url(img/special/netz/icon_m.png) no-repeat center center;
        background-size: 100%;
    }
}






.sp {
    display: none !important;
}
@media screen and (max-width: 767px) {
    .sp {
        display: block !important;
    }

    .pc {
        display: none !important;
    }
}

/* mainImg */
#mainImg{
    background: url(img/special/netz/main.jpg) no-repeat;
    background-position: center ;
    height: 688px;
    background-size: cover;
    margin-bottom: -50px;
}
.mainImg--netz{
    width: 1024px;
    margin: 0px auto 40px;
    padding-top: 30px;
}
.mainImg_img{
    margin-left: 80px;
}
.mainImg_mainmenu{
    background: url(img/special/netz/main-menu_staff-bg.png) no-repeat;
    width: 655px;
    height: 172px;
    padding-top: 12px;
    display: flex;
    margin-top: 40px;
    margin-left: 100px;
}
.mainImg_mainmenu a{
    display: block;
    width: 140px;
    height: 140px;
    border-radius: 70px;
}
.mainImg_mainmenu a:hover{
    background: url(img/special/netz/main-menu_staff-over.png) no-repeat;

}
.mainImg_mainmenu .mainmenu_1{
    margin-left: 17px;
}
.mainImg_mainmenu .mainmenu_2{
    margin-left: 21px;
}
.mainImg_mainmenu .mainmenu_3{
    margin-left: 20px;
}
.mainImg_mainmenu .mainmenu_4{
    margin-left: 20px;
}
.mainImg_mainmenu .mainmenu_1:hover{
    background-position: -15px -12px;
}
.mainImg_mainmenu .mainmenu_2:hover{
    background-position: -176px -12px;
}
.mainImg_mainmenu .mainmenu_3:hover{
    background-position: -336px -12px;
}
.mainImg_mainmenu .mainmenu_4:hover{
    background-position: -496px -12px;
}
.mainImg_mainmenu--2{
    background: url(img/special/netz/main-menu-bg.png) no-repeat;
    width: 495px;
    background-position: 3px 1px; /* 画像の違いを微調整 */
}
.mainImg_caution{
    display: flex;
    color: #fff;
    padding: 0 0 0 120px;
    font-size: 11px;
}



@media screen and (max-width: 767px) {
    #mainImg{
        width: 100%;
        padding: 0;
        height: inherit;
        margin-bottom: 0;
    }
    #mainImg img{
        width: 100%;
    }
    .mainImg_img{
        margin: 0;
    }
    .mainImg--netz{
        width: 100%;
        padding: 0;
        margin-top: 16px;
        margin-bottom: 0;
    }
}


/* main */
.img100{
    width:100%;
}
#main{
    padding-top: 0px;
    padding-bottom: 0px;
    width: 1024px;
    margin: 0px auto 0px;
}
#main .plan_content{
    background-color: #fff;
    padding: 50px;
    border-radius: 30px;
    box-shadow: 0px 4px #ddd;
    margin-bottom: 50px;
}
#main .plan_content .content_box{
    border-radius: 10px;
    border: 2px solid #008dff;
    padding: 47px;
}

.plan_title{
    margin-bottom: 50px;
}
.plan_diff_title{
    margin: 60px 0 40px;
}
.plan_diff{
    display: flex;
}
.plan_diff div{
    width: 50%;
}

@media screen and (max-width: 767px) {
    #main{
        padding-top: 0px;
        padding-bottom: 0px;
        width: 100%;
        margin: 0px auto 0px;
    }
    .plan_area_sp{
        background-color: #fff;
    }
    .plan_title_sp{
        background: no-repeat;
        background-size: 100%;
    }
    .plan_title1_sp{
        background-image: url(img/special/netz/plan_a_title_sp.png);
    }
    .off .plan_title1_sp{
        background-image: url(img/special/netz/plan_a_title_sp-off.png);
    }
    .plan_title2_sp{
        background-image: url(img/special/netz/plan_b_title_sp.png);
    }
    .off .plan_title2_sp{
        background-image: url(img/special/netz/plan_b_title_sp-off.png);
    }
    .plan_title3_sp{
        background-image: url(img/special/netz/plan_c_title_sp.png);
    }
    .off .plan_title3_sp{
        background-image: url(img/special/netz/plan_c_title_sp-off.png);
    }
    .plan_title4_sp{
        background-image: url(img/special/netz/plan_d_title_sp.png);
    }
    .off .plan_title4_sp{
        background-image: url(img/special/netz/plan_d_title_sp-off.png);
    }
    .plan_title_sp a{
        display: block;
        width: 100%;
        min-height: 44px;
    }
    .plan_box_sp{
        width: 94%;
        margin: 0 auto;
        padding-bottom: 20px;
    }
    .plan_box_sp img{
        width: 100%;
    }
    .plan_outline{
        margin-top: 40px;
    }
    .plan_diff_title_sp{
        margin-top: 40px;
        margin-bottom: 20px;
    }
    .plan_diff_sp{
        margin-top: 30px;
    }
}


.simulation_link_box{
    margin-top: 40px;
    padding: 30px 40px;
    background-color: #f5f5f5;

}
.simulation_link_box h3{
    text-align: center;
    font-size: 21px;
    font-weight: 700;
    margin-bottom: 15px;
}
.simulation_link_box h4{
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 15px;
}
.simulation_link_box p{
    margin-bottom: 15px;
    font-size:16px;
    text-align: center;
}
a.link_btn{
    display: block;
    text-align: center;
    background: linear-gradient(#008dcf, #0072ce);
    height: 50px;
    line-height: 50px;
    padding-left: 50px;
    padding-right: 50px;
    border-radius: 7px;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
}
@media screen and (max-width: 767px) {
    .simulation_link_box{
        padding: 20px;
        margin-top: 30px;
    }
    .simulation_link_box h3{
        font-size: 14px;
        margin-bottom: 8px;
    }
    .simulation_link_box h4{
        margin-bottom: 8px;
    }
    .simulation_link_box p{
        font-size:11px;
    }
    a.link_btn{
        font-size: 14px;
        padding-left: 5px;
        padding-right: 5px;
    }
}


/* flow */
.flow_content{
    width: 824px;
    margin: 100px auto;
}
.flow_content_title{
    margin-bottom: 20px;
}
.flow_box{
    display: flex;
    flex-wrap:wrap;
    padding: 3px 40px;
    border:1px solid #008dff;
    border-radius: 8px;
    background-color: #fff;
    margin-top: 10px;
}
.flow_box_icon{
    width: 180px;
    text-align: right;
}
.flow_box_icon img{
    width: 120px;
}
.flow_box_text{
    width: 540px;
    padding-left: 40px;
}
.flow_box_text h3{
    margin-top: 17px;
    margin-bottom: 5px;
    font-size: 21px;
    font-weight: 700;
}
.flow_box_text p{
    font-size:16px;
}
.flow_box_text strong{
    color:#ff0000;
    font-weight: 400;
}
.flow_arrow_img img{
    width: 40px;
    margin: 0 auto;
    display: block;
}
.flow_arrow_img--sep{
    margin-top: 20px;
    margin-bottom: 20px;
}
.flow_box .simulation_link_box{
    width: 100%;
    margin-top: 10px;
    margin-bottom: 27px;
}
@media screen and (max-width: 767px) {
    .flow_content{
        width: 94%;
        margin: 100px auto;
    }
    .flow_box{
        padding: 15px 15px 20px;
    }
    .flow_box_icon{
        width: 25%;
        text-align: right;
        display: flex;
        align-items: center;
    }
    .flow_box_icon img{
        width: 100%;
    }
    .flow_box_text{
        width: 75%;
        padding-left: 15px;
    }
    .flow_box_text h3{
        font-size: 15px;
        margin-top: 5px;
    }
    .flow_box_text p{
        font-size:12px;
    }
    .flow_box .simulation_link_box{
        margin-bottom: 0;
    }
}

/* faq */
.faq_content{
    width: 824px;
    margin: 100px auto;
}
.faq_content_title{
    margin-bottom: -20px;
}
.faq_title{
    height: 60px;
    background-size: 100% 100%;
    margin-top: 40px;
}
.faq_title a{
    display: block;
    width: 100%;
    height: 60px;
}
.faq_title1{
    background-image: url(img/special/netz/faq_title1.png);
}
.faq_title2{
    background-image: url(img/special/netz/faq_title2.png);
}
.faq_title3{
    background-image: url(img/special/netz/faq_title3.png);
}
.faq_title4{
    background-image: url(img/special/netz/faq_title4.png);
}
.off .faq_title1{
    background-image: url(img/special/netz/faq_title1-off.png);
}
.off .faq_title2{
    background-image: url(img/special/netz/faq_title2-off.png);
}
.off .faq_title3{
    background-image: url(img/special/netz/faq_title3-off.png);
}
.off .faq_title4{
    background-image: url(img/special/netz/faq_title4-off.png);
}
.faq_a + .faq_q{
    border-top: 1px solid #e5e5e5;
}
.faq_q{
    padding: 30px 0 10px 65px;
    font-size: 18px;
    font-weight: 700;
    background: url(img/special/netz/faq_q.png) no-repeat;
    background-size: 55px 30px;
    background-position: 0 28px;
    margin-left: 40px;
    margin-right: 40px;
}
.faq_a{
    padding: 10px 0 30px 65px;
    font-size: 15px;
    background: url(img/special/netz/faq_a.png) no-repeat;
    background-size: 55px 30px;
    background-position: 0 8px;
    margin-left: 40px;
    margin-right: 40px;
}
.credit_text{
    margin-top: 15px;
    padding: 20px 40px 30px;
    border-radius: 10px;
    background-color: #fff;
    font-size: 12px;
}
@media screen and (max-width: 767px) {
    .faq_content{
        width: 94%;
        margin: 100px auto 50px;
    }
    .faq_content_title{
        margin-bottom: 20px;
    }
    .faq_title{
         height: 45px;
         background-size: 100% 100%;
         margin-top: 20px;
     }
    .faq_q{
        padding: 27px 0 5px 40px;
        margin-left: 0px;
        margin-right: 0px;
        background-size: 37px 20px;
        background-position: 0 30px;
        font-size: 16px;
    }
    .faq_a{
        padding: 10px 0 30px 40px;
        margin-left: 0px;
        margin-right: 0px;
        background-size: 37px 20px;
        background-position: 0 13px;
        font-size: 13px;
    }
    .faq_title1{
        background-image: url(img/special/netz/faq_title1_sp.png);
    }
    .faq_title2{
        background-image: url(img/special/netz/faq_title2_sp.png);
    }
    .faq_title3{
        background-image: url(img/special/netz/faq_title3_sp.png);
    }
    .faq_title4{
        background-image: url(img/special/netz/faq_title4_sp.png);
    }
    .off .faq_title1{
        background-image: url(img/special/netz/faq_title1_sp-off.png);
    }
    .off .faq_title2{
        background-image: url(img/special/netz/faq_title2_sp-off.png);
    }
    .off .faq_title3{
        background-image: url(img/special/netz/faq_title3_sp-off.png);
    }
    .off .faq_title4{
        background-image: url(img/special/netz/faq_title4_sp-off.png);
    }
}

/*footer*/
.footer_pagetop{
    width: 924px;
    margin-left: auto;
    margin-right: auto;
    text-align: right;
}
.footer_pagetop img{
    width:80px;
}
footer{
    background-color: #e5e5e5;
    padding: 50px;
    padding-bottom: 20px;
}
#footer{
    width: 924px;
    margin: 0 auto;
}
.footer_caution{
    font-size: 16px;
    margin: 20px 0;
    text-align: center;
}
.footer_link{
    display: flex;
    justify-content: space-between;
}
.footer_link img{
    width: 216px;
}
.footer_download{
    margin-top: 20px;
    border-radius: 10px;
    border: 2px solid #008dff;
    padding: 10px;
    display: flex;
}
.footer_download_title{
    width: 170px;
    margin-left: 12px;
}
.footer_download_title img{
    width: 100%;
}
.footer_download_box{
    display: flex;
    justify-content: space-between;
}
.footer_download_box img{
    width: 130px;
    margin-left: 12px;
}
.footer_download_box--kokyaku img{
    width: 165px;
}
#footer_global{
    background-color: #333333;
    padding: 10px 0;
}
#footer_global .footer_wrap{
    width: 924px;
    margin:0 auto;
    display: flex;
    color: #fff;
    justify-content: space-between;
}
#footer_global a{
    color: #fff;
}
#footer_global .linkbox{
    font-size: 12px;
}
#footer_global .copyright{
    font-size: 10px;
    text-align: right;
}
@media screen and (max-width: 767px) {
    .footer_pagetop{
        width: 80px;
    }
    .footer_tel{
        margin-top: 20px;
    }
    #footer{
        width: 94%;
        margin:0 auto;
    }
    footer{
        padding: 20px 0;
    }
    .footer_caution{
        font-size:12px;
        text-align: left;
    }
    .footer_download{
        display: block;
        padding: 0;
    }
    .footer_download_title{
        border-bottom: 2px solid #008dff;
        padding-bottom: 5px;
        width: 100%;
        margin: 0;
    }
    .footer_download_title img{
        width:86px;
        margin: 10px auto 5px;
    }
    .footer_download_box{
        flex-wrap:wrap;
        justify-content: space-between;
        padding: 10px 15px 5px;
    }
    .footer_download_box a,.footer_download_box div{
        display: block;
        width: 32%;
        margin-bottom: 6px;
    }
    .footer_download_box a img{
        width: 100%;
        margin: 0;
    }

    #footer_global{
        background-color: #333333;
        padding: 10px 0;
    }
    #footer_global .footer_wrap{
        width: 100%;
        margin:0 auto;
        display: block;
        color: #fff;
    }
    #footer_global a{
        color: #fff;
    }
    #footer_global .linkbox{
        font-size: 10px;
        padding-bottom: 10px;
        text-align: center;
    }
    #footer_global .copyright{
        font-size: 9px;
        text-align: center;
    }
}

/* simulation */
#main .simulation{
    background: no-repeat;
}
#main .simulation h2{
    margin: 0 0 30px;
}
#main .simulation .whiteBox .selectUl li .txt{
    border-radius: 20px;
    background-color: #d2f0ff;
}
#main .simulation .whiteBox .ttl{
    color: #ff0000;
}
#main .simulation .whiteBox .link a,#main .simulation-result .whiteBox .link a{
    background: linear-gradient(#008dcf, #0072ce);
    border-radius: 5px;
    box-shadow:none;
}
#main .simulation .whiteBox .link a:before,#main .simulation-result .whiteBox .link a:before{
    display: none;
}

#main .simulation-result{
    background: no-repeat;
    border: none;
}
#main .simulation-result .tabUl li.on, #main .simulation-result .tabUl li:hover{
    background: linear-gradient(#008dcf, #0072ce);
}
#main .simulation-result .whiteBox .link01 a{

}
#main .simulation-result .whiteBox .ttl{
    background-color: #008dff;
}
#main .simulation-result .whiteBox .inner .lBox .txt04{
    color: #ff0000;
}
#main .simulation-result .whiteBox .inner .lBox .title01 .txt03{
    color: #ff0000;
}
#main .simulation-result .whiteBox .priceTxt.basic .num{
    color: #ff0000;
}
#main .simulation-result .whiteBox .priceTxt .txt11{
    color: #ff0000;
}
#main .simulation-result .change_shiyou_box{
    padding: 20px 40px 30px;
    background-color: #f6f6f6;
    margin-bottom: 40px;
    border-radius: 10px;
}
#main .simulation-result .whiteBox .selectUl{
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
    margin-bottom: 20px;
}
#main .simulation-result .whiteBox .selectUl li{
    float: none;
    width: 32%;
    padding: 5px;
    margin: 5px 0;
}
#main .simulation-result .whiteBox .link01{
    margin-bottom: 0;
}
#main .simulation-result .whiteBox .colorTxt{
    background: inherit;
    text-align: center;
    margin-bottom: 10px;
}
a.result_link_apply{
    background-color: #ff0000;
    padding: 10px;
    text-align: center;
    border-radius: 8px;
    color:#fff;
    margin-bottom: 12px;
    width: 100%;
    display: block;
}
a.result_link_detail{
    background-color: #fff;
    border: 2px solid #0072ce;
    padding: 10px;
    text-align: center;
    border-radius: 8px;
    color: #0072ce;
    width: 100%;
    display: block;
    font-weight: 700;
}

/* 不要コンテンツの非表示 */
#main .simulation-result .whiteBox .priceTxt.basic .txt02{
    display: none;
}

@media screen and (max-width: 767px) {
    #main .simulation h2 img{
        width: 94%;
        margin: 30px auto 0;
    }
    #main .simulation-result h2 img{
        width: 94%;
        margin: 30px auto 0;
    }
    #main .simulation-result .change_shiyou_box{
        padding: 10px 5px;
        margin-left: 5px;
        margin-right: 5px;
    }
    #main .simulation-result .whiteBox .selectUl li .txt{
        width: 30px;
        padding-left: 2px;
    }
    #main .simulation{
        background-color: #fff;
    }
    #main .simulation-result{
        background-color: #fff;
    }
}