.common_side_btbox {width:60px; position:fixed; top:0; right:0; z-index:20000;} .common_side_bt {width:60px; height:60px;} #common_side_chkbx {display:none;} .common_side_label {position:relative; display: block; cursor:pointer; z-index:20000;} #common_side_chkbx:checked + .common_side_label {} .common_side_menu_open {width:60px; height:60px; background-image:url("../images/side_bt1a.png"); background-size:100% 100%; background-color:#151515;} #common_side_chkbx:checked ~ * .common_side_menu_open {width:60px; height:60px; background-image:url("../images/side_bt1b.png"); background-size:100% 100%; background-color:#151515;} .common_side_msg {position:relative; z-index:20000;} .common_side_tel {position:relative; z-index:20000;} /*inner op_cl_base*/ .common_op_cl_base {position:fixed; width:100%; top:-150%; right:0; background-color:rgba(238,243,249,1); color:#ffffff; z-index:19000; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;} #common_side_chkbx:checked ~ .common_op_cl_base {position:fixed; width:100%; height:100vh; top:0; right:0; background-color:rgba(238,243,249,1); color:#ffffff; z-index:19000; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;} /*inner*/ .common_inner {padding:100px; min-width:1300px; max-width:1500px; display:flex; justify-content:space-between; flex-wrap: wrap; color:#222222;} .common_inner_l {width:32%;} .common_inner_c {width:28%;} .common_inner_r {width:28%;} .common_inner_l h2 {display:block; margin:0px; padding:0px 0px 40px 0px;} .common_inner_l h2 a img {width:100%; height:auto;} .common_inner_sns {display:flex; justify-content:flex-start; flex-wrap: wrap; margin:0px; padding:0px;} .common_inner_sns li {list-style:none; width:30px; margin-right:30px;} .common_inner_sns li a img {width:100%; height:auto;} .common_inner_l_ul {display:block; margin:100px 0px 0px 0px; padding:0px;} .common_inner_l_ul li {list-style:none; margin-bottom:5px;} .common_inner_l_ul li a {display:block; background-color:#266ebd; color:#ffffff; padding:20px 20px 20px 20px; font-size:18px; line-height:26px;} .common_inner_l_ul li a:hover {display:block; background-color:#3a84d4; color:#ffffff; padding:20px 20px 20px 20px; font-size:18px; line-height:26px; text-decoration:none;} .common_inner_c h3,.common_inner_r h3 {display:block; font-size:18px; line-height:30px; font-weight:700; border-top:1px solid #266ebd; border-bottom:1px solid #266ebd; margin:0px 0px 10px 0px; padding:10px 0px 10px 0px;} .common_inner_c ul,.common_inner_r ul {display:block; margin:0px 0px 20px 0px; padding:0px; font-weight:600;} .common_inner_c ul li,.common_inner_r ul li {list-style:none; margin-bottom:8px;} .common_inner_c ul li a,.common_inner_r ul li a {display:block; font-size:15px; line-height:28px; padding:3px 10px 3px 15px; border-left:1px solid #266ebd; color:#222222;} .common_inner_c ul li a:hover,.common_inner_r ul li a:hover {display:block; font-size:15px; line-height:28px; padding:3px 10px 3px 15px; text-decoration:none; border-left:1px solid #266ebd;color:#222222;} .common_inner_c ul li a span,.common_inner_r ul li a span {font-size:12px;} @media screen and (max-width:640px){ .common_side_btbox {width:50px;} .common_side_bt {width:50px; height:50px;} .common_side_menu_open {width:50px; height:50px;} #common_side_chkbx:checked ~ * .common_side_menu_open {width:50px; height:50px;} /*inner op_cl_base*/ #common_side_chkbx:checked ~ .common_op_cl_base {position:fixed; width:100%; height:100vh; top:0; right:0; overflow:scroll; background-color:rgba(238,243,249,0.9); color:#ffffff; z-index:19000; -webkit-transition: 0.3s ease-in-out; -moz-transition: 0.3s ease-in-out; -o-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out;} /*inner*/ .common_inner {padding:20px; min-width:320px; display:block; color:#222222;} .common_inner_l {width:100%;} .common_inner_c {width:100%;} .common_inner_r {width:100%;} .common_inner_l h2 {display:block; width:80%; margin:0px; padding:0px 0px 20px 0px;} .common_inner_l h2 a img {width:100%; height:auto;} .common_inner_sns {display:flex; justify-content:flex-start; flex-wrap: wrap; margin:0px 0px 0px 0px; padding:0px;} .common_inner_sns li {list-style:none; width:25px; margin-right:10px;} .common_inner_sns li a img {width:100%; height:auto;} .common_inner_l_ul {display:block; margin:0px 0px 0px 0px; padding:20px 0px 20px 0px;} .common_inner_l_ul li {list-style:none; margin-bottom:5px;} .common_inner_l_ul li a {display:block; background-color:#266ebd; color:#ffffff; padding:15px 15px 15px 15px; font-size:18px; line-height:26px;} .common_inner_l_ul li a:hover {display:block; background-color:#3a84d4; color:#ffffff; padding:15px 15px 15px 15px; font-size:18px; line-height:26px; text-decoration:none;} .common_inner_c h3,.common_inner_r h3 {display:block; font-size:18px; line-height:30px; font-weight:700; border-top:1px solid #266ebd; border-bottom:1px solid #266ebd; margin:0px 0px 10px 0px; padding:10px 0px 10px 0px;} .common_inner_c ul,.common_inner_r ul {display:block; margin:0px 0px 20px 0px; padding:0px; font-weight:600;} .common_inner_c ul li,.common_inner_r ul li {list-style:none; margin-bottom:8px;} .common_inner_c ul li a,.common_inner_r ul li a {display:block; font-size:15px; line-height:28px; padding:3px 10px 3px 15px; border-left:1px solid #266ebd; color:#222222;} .common_inner_c ul li a:hover,.common_inner_r ul li a:hover {display:block; font-size:15px; line-height:28px; padding:3px 10px 3px 15px; text-decoration:none; border-left:1px solid #266ebd;color:#222222;} .common_inner_c ul li a span,.common_inner_r ul li a span {font-size:12px;} }