@charset "utf-8";

.sub_menu {width:100%;margin:40px 0;text-align:center;}
.sub_menu li {width:33%;font-size:1.2em;display:inline-block;text-align:center;padding:10px;border-bottom:1px solid #ccc;color:#ccc;font-weight:bold;}
.sub_menu .on {color:#d81918;border-bottom:1px solid #d81918;}

.sub_info {padding:0 0 25px;}
.sub_info h2 {font-size:18px;}
.sub_info h2 span {font-weight:100;color:#666;font-size:16px;}
.sub_info ul {margin:20px 0;}
.sub_info li {line-height:1.6em;color:#666;font-size:16px;}
.sub_info li::before {content:'•';padding-right:10px;}
.sub_info .tbl_head03 {font-size:16px;}
.etc_info {font-size:14px;color:#888;}

.info_box {padding:20px 20px 20px 60px;background:#f8f8f8;border-radius:5px;margin-top:40px;}
.info_box img {position:absolute;margin-left:-40px;}
.info_box h3 {line-height:25px;color:#666;margin-bottom:10px;}
.info_box ul {margin:10px 0;}
.info_box li {color:#888;line-height:30px;}
.info_box li::before {content:'•';padding-right:10px;}

.chart_box {padding:50px 10px;text-align:center;border-radius:15px;border:1px solid #ddd;}
.chart_box .step {width:200px;}
.chart_box .arrow {margin:-20px 30px 0;}

@media ( max-width: 1200px ) {
    .sub_menu li {width:32%}
    .sub_info {width:90%;margin:0 auto;}

    .chart_box .step {width:150px;}
    .chart_box .arrow {margin:-10px 10px 0;height:20px;}
    .chart_box .chart {width:90%;}
}

@media ( max-width: 900px ) {
    .chart_box .step {margin:0 10px 20px;}
    .chart_box .arrow {display:none;}
}

@media ( max-width: 600px ) {
    .sub_menu li {font-size:1em;}
    .sub_info {width:90%;margin:0 auto;}
    .sub_info h2 {font-size:14px;}
    .sub_info h2 span {font-size:12px;}
    .sub_info ul {margin:10px 0;}
    .sub_info li {font-size:12px;}
    .sub_info .tbl_head03 {font-size:12px;}
    .etc_info {font-size:11px;}

    .info_box {font-size:12px;}
    .info_box li {line-height:20px;margin-left:-40px;}

    .chart_box .step {width:40%;margin:0 10px 20px;}
    .chart_box .chart {width:100%;}
    .chart_box #chart1 {content:url('./img/guide2_1_m.jpg');}
    .chart_box #chart2 {content:url('./img/guide2_2_m.jpg');}
}