/* CSS Document */

#useful_link_list { margin-bottom: 30px;}
#useful_link_list { display: flex; justify-content: flex-end; flex-direction: row-reverse; align-items: center; }
#useful_link_list picture img{ max-width: 100%; height: auto; margin-top: -25px; }

#useful_link_list li { box-sizing: border-box; margin-right: 0; margin-left: 15px; margin-bottom: 25px;}
#useful_link_list li a { display: block; color: #222; text-decoration: none;font-size: 1.5rem; font-weight: bold; position: relative;padding-left: 20px;line-height:1; width: 200px; padding: 15px; border: 1px solid #c4c4c4; border-radius: 5px; letter-spacing: 0.75px;box-sizing: border-box;}
#useful_link_list li a:hover {opacity: 0.6;}
#useful_link_list li a:after { position: absolute; content: "";top: 50%; margin-top: -8px; right: 15px;
width: 8px;
height: 8px;
border-bottom: #60a82c 3px solid;
border-right: #60a82c 3px solid;
transform: rotate(45deg);
}

.point_link_box { margin-bottom: 30px; }
.point_link_box li { margin-top: 50px; }
.point_link_box li:first-child { margin-top: 0; }
.point_link_box h3 { font-size: 2rem; font-weight: bold; color: #3b8935; letter-spacing: 0.75px; margin-bottom: 20px; padding-bottom: 5px; border-bottom: 1px solid #60a82c; }
.point_link_box p.point_txt { font-size: 1.5rem; line-height: 1.7; margin-bottom: 20px; }
p.box_lead { font-size: 17px; font-weight: bold; color: #3b8935; letter-spacing: 0.75px; margin-bottom: 25px; }
div.box_wrap { display: flex; justify-content: space-between; align-items: center; }
div.note_weight { width: auto; padding: 10px 25px 20px; border-radius: 10px; text-align: center; border: 1px solid #ccc; }
div.note_weight .weight_txt { font-size: 1.6rem; font-weight: bold; margin-bottom: 20px; padding: 3px 0; border-bottom: 2px dashed #60a82c; }
div.note_weight img{ width: 200px; height: auto; }
ul.weight_sub { width: 67%; display: flex; justify-content: space-between; }
ul.weight_sub li { width: 47%; margin-top: 0; }
ul.weight_sub li p { font-size: 1.4rem; }
ul.weight_sub img { max-width: 100%; height: auto; }

.point_memo{ width:88%; background: #f2f2f2; margin:40px auto 50px; padding: 25px 20px 20px; position: relative; }
.point_memo p{ font-size: 14px; }
.point_memo p.memo_title{ display: inline-block; margin-top: -18px;padding: 3px 8px;font-size: 18px;color: #60a82c;font-weight: bold;position: absolute;top:0;left: 10px;}
.point_memo > div{ display: flex;justify-content: space-around;flex-wrap: wrap; }
.point_memo figure{ margin-top: 20px;box-sizing:border-box; }
.point_memo figure img{ width: 170px;height: auto;border: #ccc solid 1px;box-sizing:border-box;  }
.point_memo figcaption dt{ margin-top: 10px;font-size: 14px;font-weight: bold; }
.point_memo figcaption dd{ margin: 3px 0 8px 0;font-size: 13px; }


ul.sub_wrap,ul.sub_wrap_3 { display: flex; width: 95%; margin: 30px auto 0; justify-content: space-between; }
ul.sub_wrap li { width: 45%; margin-top: 0; position: relative; }
ul.sub_wrap_3 li { width: 31%; margin-top: 0; text-align: center; }
section:not(#transfer) ul.sub_wrap li:first-child::after { content: ""; display: block; width: 25px; height: 25px; border-top: 6px solid #777; border-right: 6px solid #777; transform: rotate(45deg); position: absolute; top: 35%; right: -30px; }
ul.sub_wrap img,ul.sub_wrap_3 img { max-width: 100%; height: auto; }
ul.sub_wrap p,ul.sub_wrap_3 p { font-size: 1.5rem; margin-top: 10px; }

@media print, screen and (min-width: 768px) {
#useful_link_list ul { display: flex; flex-wrap: wrap; width: 480px; }
.point_link_box { padding-top: 200px; margin-top: -200px;}
}
@media screen and (max-width: 767px) {
.sub_page h2.sub_cmn_h2 { font-size: 2.4rem; }
#useful_link_list { margin: 30px 10px 20px; display: block; flex-direction: column; text-align: center; }
#useful_link_list picture img{ max-width: 100%; height: auto; }
#useful_link_list ul { margin: 0 auto; margin-top: 30px; }
#useful_link_list li { margin-bottom: 10px; margin-right: 0; }
#useful_link_list li a { font-size: 1.5rem; line-height: 1; width: 90%; margin: 0 auto; }

.point_link_box { padding: 120px 0 0; margin: 0 10px; margin-top: -80px; }
.full_img { max-width: 100%; height: auto; }

div.box_wrap { display: block; }
div.box_wrap p.box_img img{ max-width: 100%; height: auto; margin: 0 auto;  }

ul.weight_sub { display: block; margin: 0 auto; margin-top: 20px; width: 80%; }
ul.weight_sub li { width: 100%; margin: 30px auto 0; }
ul.weight_sub li p { font-size: 1.6rem; }

.point_memo{ width:95%;padding:25px 10px 20px; margin-top: 50px; }
.point_memo figure{ width: 45%;margin-top: 20px; letter-spacing:1px; }
.point_memo figure img{ max-width:100%; }
.point_memo figcaption dt{ margin-top: 5px;font-size: 14px; }

ul.sub_wrap,ul.sub_wrap_3 { display: block; width: 80%; margin: 0 auto 0; }
ul.sub_wrap li { width: 100%; margin-top: 60px; position: relative; }
ul.sub_wrap_3 li { width: 100%; margin-top: 30px; }
section:not(#transfer) ul.sub_wrap li:first-child::after { content: ""; display: block; width: 25px; height: 25px; border-top: 6px solid #777; border-right: 6px solid #777; transform: rotate(135deg); position: absolute; top: 100%; right: 50%; }
ul.sub_wrap p { font-size: 1.6rem; }
}
@media screen and (max-width: 500px) {
#useful_link_list picture img{ max-width: 90%; height: auto; }
}