@media screen and (min-width: 769px) {
.lightbox,
.lightboxOverlay{min-width: var(--site_size);}
.under main{padding-top: 158px}
/* HOVER */
.under main #topic_path li a:hover{text-decoration:underline}
.under main a[data-lightbox]:hover,
.under main .bnn a:hover{opacity: 0.7;}

.under main .ovn_content p a:not([target=_blank]):hover,
.under main .link:not([target=_blank]):hover{text-decoration: none}

.under main .list_toc a:hover{text-decoration: none}


.under main .list_anchor{width: calc(100% + 30px)}
.under main .list_anchor a:hover{background-color: var(--mcolor);opacity: 1;border-radius: 10px}
.under main .list_anchor a:hover::after{opacity: 0}


.under main .max-500{max-width:500px;}
.under main .float_l{float: left}

.under main .frame_pick .image_l,.under main .frame_pick .image_r{margin-top:10px}
.under main .list_step .item:last-child{margin-right: 0;left: -5px}
.under main .list_step2{margin-top: 80px}
.under main .col4 .item{width: calc(100% / 4);}
.under main .box_under .frame02_share{min-height: 594px;}
.under main .box_under .frame02_strength{min-height: 484px;}
.under main .box_under .frame02_road{min-height: 1051px;}
.under main .box_under .frame01_land{min-height: 478px;}
.under main .box_under .frame01_case{min-height: 498px;}

.under main .u_item{display: flex;justify-content:space-between;align-items:center;}
.under main .row-reverse{flex-direction: row-reverse;}
.under main .u_item .info{width:calc(100% - 485px);}

}
@media screen and (min-width: 769px) and (max-width: 1600px){
    .under main #top_info::after{right:300px}
    .under main .frame_pick .box_frame_pick{margin-right: 30px}

    .under main .box_under .box_right{width: 42%}
    .under main .box_under .box_left .f_medium{font-size: 105%}

    .under main .list_anchor a{width:350px;}
    .under main .list_anchor a::after{width:calc(100% - 10px);}
}
@media screen and (max-width: 768px) {
.under main #content{padding:0 0 80px}
.under main section{padding:0 0 60px;}

.under main .image_r,
.under main .image_l{float:none;display:inline-block;width:100%;text-align:center;margin:0 auto 30px !important}

/*==========================================================
                 C U S T O M
==========================================================*/
/*  TOP INFO  */
.under main #top_info{border-radius: 50px;padding: 30px 10px 50px 10px;margin: 20px auto 0 auto;width: calc(100% - 30px);}
.under main #top_info::before{width: 100%;height: 100%;bottom: -18px;border-radius: 0 0px 0px 50px;left: 30px;}
.under main #top_info::after{width:57px;right: 40px;bottom: -15px;}
.under main #topic_path{margin: 30px 0;}
.under main #topic_path li,
.under main #topic_path li a{font-size: 14px;}
.under main #topic_path li:not(:last-child)::after{margin: 0 10px 0 15px}

.under main .list_anchor{margin-bottom:40px}
.under main .list_anchor .btn:last-child{margin-bottom:0}
.under main .list_anchor a{width: 280px;font-size: 16px;padding: 0 30px;background-size: 10px auto;background-position: center right 10px;border-radius: 10px;}
.under main .list_anchor a::before{bottom: -8px;left: 8px;border-radius:10px}
.under main .list_anchor a::after{width: 100%}

/*============ HEAD TITLE ============ */
.under main .u-tt-ja{font-size:26px;}
.under main .tt-en{font-size: 16px;left: 0;}

.under main h2{font-size:24px;border-bottom-width: 4px;margin-bottom: 25px;padding-bottom: 10px;}
.under main h3,
.under main .ovn_content h3{font-size:22px;padding-left: 30px;}
.under main h3::before, .under main .ovn_content h3::before{width: 8px}
.under main h4,
.under main .ovn_content h4{font-size:20px;}
.under main h5,
.under main .ovn_content h5{font-size:18px;}
.under main h6,
.under main .ovn_content h6{font-size:16px;}

/*============ TABLE ============ */
.under main table{margin-bottom:30px}
.under main table td,
.under main table th{padding:10px}
.under main table th,.under main table.mailform th{font-size: 16px}
.under main table.tb_block tr{display:flex;flex-direction:column}
.under main table.tb_block tr:not(:last-child) th{border-bottom:none}
.under main table.tb_block td + td{border-top: none;}
.under main table.tb_block th,
.under main table.tb_block td{width: 100%;}
.under main table.tb_block td{border: none;}
.under main table.tb_block tr:last-child td{border-bottom: 1px solid #ddd}
.under main table.mailform tr:first-child th, .under main table.tb_block tr:first-child th{border-top-color: #fcf58c;}
.under main table.mailform tr:last-child th, .under main table.tb_block tr:last-child th{border-bottom-color: #fcf58c;}
/* TABLE SCROLL */
.under main .tb_scroll{overflow:scroll;}
.under main .tb_scroll:not(:last-child){margin-bottom: 30px;}
.under main .tb_scroll table{width: 800px;}
.under main .tb_note{margin-bottom: 10px;color: #999;}

/*============ LIST ============ */
.under main .list01,
.under main .ovn_content ul{}
.under main .list01 li,
.under main .ovn_content ul li{padding-left: 20px;word-break: break-all;}
.under main .list01 li::before,
.under main .ovn_content ul li::before{width: 10px;height: 10px;top: 6px;}

.under main .list02 li::before, .under main .ovn_content ol li::before{padding: 0;top: 0px;}

.under main .list_check{}
.under main .list_check li{}

/* LIST FAQ */
.under main .list_faq dl{margin-bottom: 30px; padding: 15px}
.under main .list_faq dt span{top:3px;}
.under main .list_faq dt{font-size: 18px;min-height: 50px;padding-bottom: 3px;}
.under main .list_faq dd span{font-size: 18px}

/* List STEP */
.under main .list_step{margin:40px 0 30px 0;flex-direction: column}
.under main .list_step .item{margin: 0 0 70px 0;width: 100%;}
.under main .list_step .item:last-child{margin-bottom: 0}
.under main .list_step .item .step_num{font-size: 30px;width: 55px;height: 55px;padding: 1px 0 0 0;margin: 0 auto 20px auto;}
.under main .list_step .item .step_num::before{width: 40px;}
.under main .list_step .item .step_num::after{bottom: -8px;z-index: -1}

.under main .list_step .item .step_name{font-size: 18px;}
.under main .list_step .item:not(:last-child)::before{top: initial;bottom: -24px;transform: rotate(90deg);left: 0;right: 0;margin: 0 auto;width: 20px;}

/*============ FRAME ============ */
.under main .frame01{padding:30px 15px}

.under main .frame02{padding:30px 15px}

.under main .frame_pick{margin: 0}
.under main .frame_pick::before,.under main .frame_pick::after{width: calc(100% + 30px);left: -15px}
.under main .frame_pick::before{top: -4px}
.under main .frame_pick::after{bottom: -2px;}
.under main .frame_pick .info_frame_pick{padding: 50px 0;}
.under main .frame_pick .box_frame_pick{width: calc(100% - 30px);margin: 0 auto 50px auto;padding: 50px 30px;}
.under main .frame_pick .box_frame_pick::before{left: 15px;top: 15px;}
.under main .frame_pick .pick_ttl{font-size: 25px;padding: 0 0 20px 45px;line-height: 1.5em;}
.under main .frame_pick .pick_ttl::before{width: 35px;}
.under main .frame_pick .pick_ttl::after{width: 100%}
.under main .frame_pick .box_frame_pick .box_txt_img{margin-bottom: 20px}
.under main .frame_pick2 .ic_pick2{width: 70px;}
.under main .frame_pick2 .txt_pick2{width:calc(100% - 100px);}

/* ============ ORTHER ============ */
.under main .box_map{height:250px}
.under main .box_under{flex-direction: column}
.under main .box_under .box_left,.under main .box_under .box_right{width: 100%}
.under main .box_under .box_left{margin-bottom: 30px}
.under main .box_under .box_left_road{margin: 30px 0 0 0}
.under footer .ft_top{padding:0}
.under main .bg_under{padding: 20px 15px 30px 15px}
.under main .box_under2{flex-direction: column;}
.under main .box_under2 .item{width:100%}
.under main .box_under2 .item:not(:last-child){margin-bottom:20px}

}


/* IPHONE 14 */
@media screen and (max-width: 440px) {
.under main .tt-en svg text{  text-anchor: middle;transform-box: fill-box;transform-origin: center;transform: translateX(-3%);}
.under main .frame_pick .box_frame_pick{padding: 50px 20px}
.under main .frame_pick .img_pick::before{width: 214px;bottom: -12px;}
.under main .frame_pick .pick_ttl{font-size: 6vw}
}
/* IPHONE 14 */
@media screen and (max-width: 390px) {
.under main .tt-en svg text{transform: translateX(-16%);}
}
@media screen and (max-width: 375px) {
.under main .tt-en svg text{transform: translateX(-18%);}
}
@media screen and (max-width: 360px) {
.under main .tt-en svg text{transform: translateX(-28%);}
}
/* IPHONE 6 */
@media screen and (max-width: 360px) {
.under main .tt-en svg text{transform: translateX(-50%);}
}
