/*2カラム用css

ブログ
よくあるご質問
保険商品のご案内
*/
/*
左カラム幅
width：240px

main幅
width:740px

左カラムとmainの間
20px*/

/* ------------------------------------------------------------

よくあるご質問

------------------------------------------------------------*/
/* 左カラム */
#question_left_box{
background: #ffffff;
width: 240px;
height: 1000px;
border-radius: 5px;
}
#question_left_box .menu-product_left_menus-container{
padding: 4px;
}
#question_left_box ul{
padding-inline-start: 20px !important;
margin-block-start: 0px !important;
margin-block-end: 0px !important;
border-top: 4px #999fa4 solid;
}
#question_left_box ul li{
margin-right: 20px;
border-bottom: 1px #999fa4 solid;
background-image: url("/PC_images/question/arrow_right_b.png");
background-repeat: no-repeat;
background-position: 2% 50%;
}
#question_left_box ul li a{
padding-left: 20px;
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
display: block;
color: #000000;
}

/* 右カラム */
#question_right_box{
background: #ffffff;
width: 740px;
border-radius: 5px;
padding: 4px 4px 60px 4px;
}
#question_right_box #panel-48-0-1-0{
border-top: 4px #f5002f solid;
}
#question_right_box .siteorigin-widget-tinymce{
padding-left: 40px;
padding-right: 40px;
}
#question_right_box .question_text{
font-weight: bold;
margin-bottom: 5px;
}
#question_right_box .question_text .question_blue{
color: #008fdb;
margin-right: 10px;
}
#question_right_box .answer_text{
background: #f9f9f9;
padding: 20px;
margin-left: 25px;
margin-top: -15px;
margin-bottom: 25px;
}
#question_right_box .answer_red{
font-weight: bold;
color: #f5002f;
margin-right: 10px;
}
#question_right_box .sub_text{
font-weight: bold;
font-size: 110%;
}

/*
左カラム くるまの保険・マイカーローン #question_car
左カラム 住まいの保険 #question_sumai
左カラム 旅行・レジャー・ペットの保険 #question_travel
左カラム がん・医療・ケガの保険 #question_iryou

これらの４つのアンカーリンクを押すと上のタイトル部分が表示されなくなってしまう。
原因は、#site-content{ overflow: overflow; }である。
対策として、初期値でもある#site-content{ overflow: visible !important; }に変更する。
この方法ならばアンカーリンクを押しても上のタイトル部分は表示されたまま。
*/
#site-content{
/*overflow: visible !important;*/
overflow: auto ;
}

/* お問い合わせ よくあるご質問専用 */
#question_inquiry_box{
width: 1000px;
margin: 20px auto 30px;
}
#question_inquiry_box .inquiry_underside{
background: none !important;
}
.inquiry_underside img {
    display : inline ;
}

/*
#question_inquiry_box .inquiry_underside .inquiry_message{
border: none !important;
margin-left: 0 !important;
margin-right: 220px !important;
padding-top: 20px !important;
padding-bottom: 10px !important;
}

#question_inquiry_box #inquiry_bottom_box .inquiry_staff{
position: relative;
bottom: 80px;
left: -20px;
}

#question_inquiry_box .inquiry_underside .inquiry_ok{
padding-left: 0 !important;
}
*/

/* ------------------------------------------------------------

各保険ページ

------------------------------------------------------------*/
/* 左カラム */
#product_left_box{
background: #ffffff;
width: 240px;
height: auto;
border-radius: 5px;
margin-bottom: 20px;
padding: 4px;
/*float: left;*/
}
#product_left_box >.panel-first-child{
border-top: 5px #999fa4 solid;
}
#product_left_box .widget-title{
padding-top: 10px!important;
padding-left: 10px!important;
padding-right: 10px!important;
font-size: 100%!important;
font-weight: bold;
}
#product_left_box .widget-title:after{
/*content: "\A"!important;*/
white-space: pre!important;
/*content: "取り扱い商品手続き方法"!important;*/
position: inherit!important;
border: none;
padding-top: 0;
padding-bottom: 0;
}
#product_left_box .menu_car >a{
background: #e7ffe3;
}
#product_left_box .menu_sumai >a{
background: #ffefdb;
}
#product_left_box .menu_travel >a{
background: #f7ffd9;
}
#product_left_box .menu_iryou >a{
background: #f5f5f5;
}
#product_left_box .menu_car >a,
#product_left_box .menu_sumai >a,
#product_left_box .menu_travel >a,
#product_left_box .menu_iryou >a{
font-weight: bold;
text-decoration: none;
color: #525b5c;
font-size: 90%;
display: block;
margin-top: 10px;
margin-bottom: 10px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 25px !important;
}
#product_left_box #menu-product_left_menus_det{
padding-left: 10px !important;
padding-right: 10px !important;
}
#product_left_box .sub-menu{
padding-left: 0 !important;
padding-right: 0 !important;
}
#product_left_box .menu-item-type-custom a{
padding-top: 10px;
padding-bottom: 10px;
padding-left: 25px !important;
background-image: url("/PC_images/question/arrow_right_b.png");
background-repeat: no-repeat;
background-position: 2% 50%;
text-decoration: none;
display: block;
color: #000000;
font-size: 90%;
border-bottom: 1px #cccccc solid;
}
#product_left_box .sub_top{
border-top: 1px #cccccc solid;
}

/* 右カラム */
#product_right_box{
background: #ffffff;
width: 740px;
height: auto;
border-radius: 5px;
margin-bottom: 20px;
padding-bottom:60px;
/*float: right;*/
}
#product_right_box .main_rightside{
padding: 4px;
}
#product_right_box h2 span{
font-size:70%;
}
#product_right_box .main_border{
border-top: 5px #f5002f solid;
}
#product_right_box .main_cluster{
margin: 50px;
}
/*
#product_right_box .main_chapter{
border-left: 4px #f5002f solid;
padding-left: 20px;
}
#product_right_box .main_subchapter{
border-bottom: 2px #999fa4 solid;
padding-top: 16px;
padding-bottom: 16px;
position: relative;
width: 100%;
}
#product_right_box .main_subchapter:after{
border-bottom: 2px #f5002f solid;
padding-top: 16px;
padding-bottom: 16px;
content: "";
display: block;
position: absolute;
width: 50%;
bottom: 0;
margin-bottom: -2px;
}*/
#product_right_box .hoken_car,
#product_right_box .hoken_home{
text-align:center;
margin: 1rem auto;
display: block;
}
#product_right_box .box.car_insurance ul li.btn a, 
#product_right_box .box.accident ul li.btn a {
    display: block;
    color: #fff;
    font-size: 110%;
    font-weight: bold;
    text-decoration: none;
    text-align: center;
    padding: 10px 30px;
    border-radius: 5px;
    position: relative;
}
#product_right_box .box ul {
    padding: 0;
    margin: 0;
}
#product_right_box .box.car_insurance{margin:20px 20px 20px 0px;}
#product_right_box .car_insurance ul.btn_list li {width: 100%;margin-bottom:10px;}
#product_right_box .box.car_insurance ul li.btn a img,
#product_right_box .box.accident ul li.btn a img {
    vertical-align: middle;
    margin-right: 10px;
   display: inline-block;
}
#product_right_box .box.car_insurance ul li.btn a:after,
#product_right_box .box.accident ul li.btn a:after {
    display: block;
    content: "";
    width: 8px;
    height: 8px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(45deg);
    position: absolute;
    right: 20px;
    top: 40%;
}
#product_right_box .box ul li.estimate a {
    background-color: #f49b00;
}
#product_right_box .box ul li.renewal a {
    background-color: #00b7f3;
}
#product_right_box .main_cluster .box p{
margin-top:0;
margin-bottom:0;
}

#product_right_box .loan{
width:182px;
height:146px;
border: 1px #e6e6e6 solid;
background: #f6f6f6;
border-radius: 5px;
padding:2rem;
font-size:1.2rem;
}
#product_right_box .loan .bnr_frame {
background: #ffffff;
width: 90%;
height: 70px;
border-radius: 5px;
margin: 0 auto 2.6rem auto;
position: relative;
}
#product_right_box .loan .bnr_frame img {
    display: inline-block;
    width: 118px;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}

/* お問い合わせ 各保険ページ専用 */
#product_right_box .inquiry_underside{
background: #ffffff;
height: 200px;
border-top: 1px #e6e6e6 solid;
border-radius: 5px;
width: 90%;
margin: 0 auto;
}
#product_right_box .inquiry_underside .inquiry_message{
font-size: 120%;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
border-bottom: 1px #e6e6e6 solid;
border-left: 1px #e6e6e6 solid;
border-right: 1px #e6e6e6 solid;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
#product_right_box .inquiry_underside .inquiry_triple{
border-left: 1px #e6e6e6 solid;
border-right: 1px #e6e6e6 solid;
border-bottom: 1px #e6e6e6 solid;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
padding-top: 15px;
padding-bottom: 5px;
margin-bottom: 10px;
}
#product_right_box .inquiry_underside .inquiry_ok{
display: inline-block;
padding-left: 50px;
padding-right: 10px;
}
#product_right_box .inquiry_underside .inquiry_number{
display: inline-block;
padding-right: 20px;
text-align: center;
}
#product_right_box .inquiry_underside .inquiry_number #big_phone{
font-size: 240%;
font-weight: bold;
}
#product_right_box .inquiry_underside .inquiry_number #big_phone a{
color:#525b5c !important;
text-decoration:none !important;
}
#product_right_box .inquiry_underside .inquiry_number #small_time{
font-size: 90%;
}
#product_right_box .inquiry_underside .inquiry_goto{
display: inline-block;
padding-left: 20px;
padding-right: 20px;
background: #f4002f;
height: 50px;
width: 220px;
line-height: 50px;
text-align: center;
border-radius: 5px;
box-shadow: 0px 4px 1px 1px rgba(0,0,0,0.1);
bottom: 30px;
position: relative;
}
#product_right_box .inquiry_underside .inquiry_goto:hover{
background: rgba(255, 0, 0, 0.5);
}
#product_right_box .inquiry_underside .inquiry_goto a{
text-decoration: none;
display: block;
}
#product_right_box .inquiry_underside .inquiry_goto #goto_string{
color: #ffffff;
font-size: 110%;
font-weight: bold;
}
#product_right_box .inquiry_underside .inquiry_goto #goto_right{
left: 40px;
position: relative;
}
#product_right_box .inquiry_underside .inquiry_check{
text-align: center;
}
#product_right_box .inquiry_underside .inquiry_check a{
color: #525b5c;
}

/* 左メインコンテンツ */
h2 span{
font-size:80%;
}

/* 左メインコンテンツ バナー等2列になっている箇所 */
/*2ブロック_枠_親要素*/
.box{
display:flex;
justify-content: flex-start;
}
/*2ブロック_子要素*/
.box .child{
width: 50%;
}
.box .child .bnr_under{
width: 80%;
margin: 0;
}


@media (min-width:560px) and (max-width:780px){ 
    .panel-no-style, .panel-has-style > .panel-row-style {
        -webkit-flex-direction: unset !important ;
        -ms-flex-direction: unset !important ;
        flex-direction: unset !important ;
    }
}
