body { background-color: #FFFFFF; color: #212121; font-size: 15px } .comment_box { padding: 0; } .comment_title { text-align: center; position: relative; margin: 9px 0 20px; } .comment_title p { font-size: 16px; font-weight: bold; display: inline-block; padding: 0 6px; background: #fff; position: relative; z-index: 10; line-height: normal; margin: 0; } .comment_title:before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 2px; width: 100%; background: #000; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .balloon { color: #000000; background-color: #ffffff; box-shadow: 0 0px 3px 0 rgba(0, 0, 0, 0.5); border: solid 1px #4f4f4e; width: 95%; padding: 10px; text-align: left; line-height: 22px; border-radius: 0.5em; margin: 0 auto 20px; font-size: 14px; } #main_contents #tab_wrap .ranking-table .comparison_item_1 td p { font-weight: bold; font-size: 1.05rem; margin-top: 0; } #main_contents #tab_wrap .ranking-table .comparison_item_pc_3 td p { font-weight: bold; font-size: 1.05rem; margin-top: 0; } div.word_text div.flex_wrap div.text_wrap div.description { font-size: 14px; font-weight: bold; } #wrapper { width: 100%; height: auto; float: left; } .color:#dd254b { font-size: 15px; color: #dd254b; } star-color { font-size: 15px; 　　 color: #dd254b; } element.style { font-size: 20px; font-weight: normal; } .word_mouth .word_text { padding: 12px 10px; background: #fcdefc; } .word_mouth .title { margin: 9px 0 20px; } .btn_wrap { text-align: center; margin: 23px; } .title-copy { font-size: 17px; color: #333333; font-weight: 600; padding: 0 15px; text-align: center; margin: 10px; margin-top: -14px; } .star-size { font-size: 17px; } #header { width: 100%; height: auto; float: left; background: #e30f87; } div.item_info_detail ul li div.text_wrap { width: auto; font-size: 16px; font-weight: bold; } #header .left { width: 20%; height: auto; float: left; padding: 8px; padding-left: 15px; } #header .logo { width: 60%; height: auto; float: left; padding: 8px; padding-left: 15px; text-align: center; } #header .logo h1 { color: #E0E0E0; font-size: 100%; font-weight: normal; line-height: 2em; } #header .logo img { width: auto; height: 40px; } #header .nav_button, .contents_header .nav_button_footer { width: 20%; height: auto; float: right; padding: 5px; margin-top: 4px; } .contents_header .nav_button_footer { width: 100%; height: auto; padding: 0px; margin-top: -10px; margin-bottom: -10px; text-align: center; } #header .nav_button button, .contents_header .nav_button_footer button { margin: 0; padding: 0; width: auto; height: 36px; } #header .nav_button button .bar, .contents_header .nav_button_footer button .bar { display: block; border-top: 2px solid #FFF; width: 21px; height: 1px; margin: 4px 0 0 0; border-radius: 2px; } #header .nav_button button .bar_text, .contents_header .nav_button_footer button .bar_text { font-size: 90%; color: #000000; vertical-align: baseline; } #header .nav_menu { display: none; width: 100%; height: auto; float: left; background: #ffdbe3; } #header .nav_menu ul li { border-bottom: dotted #757575 1px; } #header .nav_menu ul li:last-child { border-bottom: none; } #header .nav_menu ul li a { position: relative; display: block; width: 100%; height: 100%; padding: 10px; padding-left: 20px; } #header .nav_menu ul li a > span { font-size: 80%; color: #000000; } #header .nav_menu ul li a > span:after { position: absolute; content: ">"; right: 10px; } #main_contents { width: 100%; height: auto; float: left; } #main_contents .main { width: 100%; height: auto; float: left; } #main_contents .contents_header { width: 100%; height: auto; float: left; padding: 10px; background: #c7b79b; } img.rank_icon { width: auto; height: 22px; margin-right: 5px; } img.rank_icon_list { width: auto; height: 24px; margin-right: 3px; vertical-align: -3px; } #main_contents .contents_header h2 { font-size: 90%; color: #FFF; } #main_contents .menu_button { display: inline-block; margin: 10px 0; } #main_contents .menu_button a { display: inline-block; text-align: center; } #main_contents .menu_button img { width: 80%; margin: 10px 0; } #main_contents #tab_wrap { width: 100%; height: auto; float: left; } #main_contents #tab_wrap .scroll_menu { width: 100%; height: auto; float: left; overflow-x: scroll; background: #ffb8c9; } #main_contents #tab_wrap .scroll_menu ul { width: 2000px; float: left; } #main_contents #tab_wrap .scroll_menu ul > li { width: 100px; float: left; list-style-type: none; } #main_contents #tab_wrap .scroll_menu ul > li a { font-size: 75%; color: #ff003c; text-decoration: none; display: block; padding-top: 10px; padding-bottom: 10px; text-align: center; width: 100%; background: #ffb8c9; } #main_contents #tab_wrap .scroll_menu ul > li a:hover, #main_contents #tab_wrap .scroll_menu ul > li a.current { background: #e30f87; color: #FFFFFF; } #main_contents #tab_wrap .ranking-table { background: #fff; display: inline-block; margin-left: 10px; overflow: scroll; width: calc(100% - 20px); -webkit-overflow-scrolling: touch } .ranking-table::-webkit-scrollbar { height: 5px; } #main_contents #tab_wrap .ranking-table table { table-layout: fixed; width: 600px; } #main_contents #tab_wrap .ranking-table .crown { width: 80%; height: auto; } #main_contents #tab_wrap .ranking-table th { background: #eaeaea; font-size: 1.5rem; } #main_contents #tab_wrap .ranking-table td, #main_contents #tab_wrap .ranking-table th { border: solid 1px #a0faaa; padding: 0.1em; text-align: center; width: 90px; } #main_contents #tab_wrap .ranking-table td:first-child, #main_contents #tab_wrap .ranking-table th:first-child { width: 60px; min-width: 60px; background: #eaeaea; font-weight: bold; } #main_contents #tab_wrap .ranking-table p { font-weight: bold; } #main_contents #tab_wrap .ranking-table tr th:not(.column-1) p { font-weight: bold; font-size: 1.2rem; } #main_contents #tab_wrap .ranking-table tr th:nth-child(2) p { color: rgba(0, 0, 0, 0); background-image: url(/images/c1.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr th:nth-child(3) p { color: rgba(0, 0, 0, 0); background-image: url(/images/c2.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr th:nth-child(4) p { color: rgba(0, 0, 0, 0); background-image: url(/images/c3.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr:nth-child(3) td:not(.column-1) p { font-weight: bold; font-size: 1.2rem; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) { padding: 5px; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) a { display: block; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) a img { width: 100%; height: 100%; object-fit: contain; } #main_contents #tab_wrap #tab_contents { width: 100%; height: auto; float: left; background: #FFFFFF; } #main_contents #tab_wrap #tab_contents p.none_data { text-align: center; margin-top: 20px; margin-bottom: 10px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div, #main_contents .basic_list { width: 100%; height: auto; float: left; background: #FFFFFF; } #main_contents .basic_list.comment:not(.all_list) { width: 96%; margin-left: 2%; max-height: 450px; overflow: scroll; border: solid #E0E0E0 3px; margin-top: 10px; } #main_contents #tab_wrap #tab_contents > div > ul, #main_contents .basic_list > ul { width: 100%; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li .a_change .list_wrap h3 .title_wrap h2 { font-size: 18px; line-height: 1.2; color: #fff; padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li, #main_contents .basic_list > ul > li { position: relative; width: 100%; float: left; border-bottom: solid #BDBDBD 1px; } #main_contents #tab_wrap #tab_contents > div > ul > li:last-child, #main_contents .basic_list > ul > li:last-child { border-bottom: none; } #main_contents #tab_wrap #tab_contents > div > ul > li > a, #main_contents .basic_list > ul > li > a, #main_contents .basic_list > ul > li > span { display: block; width: 95%; width: 100%; float: left; font-size: 70%; color: #212121; text-decoration: none; padding: 10px; background: #FFFFFF; } #main_contents .basic_list > ul > li > span { width: 100%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap, #main_contents .basic_list > ul > li > a .list_wrap, #main_contents .basic_list > ul > li > span .list_wrap { width: 100%; height: auto; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap h3, #main_contents .basic_list > ul > li > a .list_wrap h3, #main_contents .basic_list > ul > li > span .list_wrap h3 { font-size: 1.2rem; margin-bottom: 10px; background: #fffcd3; border-bottom: solid 1px #efe6bb; margin-top: -10px; margin-left: -10px; width: calc(100% + 20px); padding: 10px; border-radius: 10px 10px 0 0; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb, #main_contents .basic_list > ul > li > a .list_wrap .thumb, #main_contents .basic_list > ul > li > span .list_wrap .thumb { position: relative; width: 110px; height: 110px; float: left; overflow: hidden; margin-top: 15px; margin-bottom: 15px; border-radius: 10px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .thumb { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info, #main_contents .basic_list > ul > li > a .list_wrap .item_info, #main_contents .basic_list > ul > li > span .list_wrap .item_info { width: 220px; width: calc(100% - 110px); min-height: 130px; float: left; padding-left: 10px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info { width: 100%; height: auto; padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info h3, #main_contents .basic_list > ul > li > a .list_wrap .item_info h3, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 { font-size: 140%; line-height: 1.9em; } #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 { line-height: 1em; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info h3 { font-size: 120%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > a .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 span { color: #ef5350; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p, #main_contents .basic_list > ul > li > a .list_wrap .item_info p, #main_contents .basic_list > ul > li > span .list_wrap .item_info p { font-size: 110%; margin-bottom: 5px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info p:last-child { font-size: 95%; margin-top: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail { display: inline-block; margin-top: 15px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail .catch { display: inline-block; color: #ff0e0e; font-size: 1rem; margin-bottom: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail p { line-height: 20px; } #main_contents .basic_list.comment > ul > li > .list_wrap .item_info_detail p:last-child { } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment { font-size: 110%; margin-left: 5px; margin-right: 5px; color: #FFAD1C; letter-spacing: 1px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i { font-family: FontAwesome; font-style: normal; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_star:before { content: "\f005"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_empty_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_empty_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_empty_star:before { content: "\f006"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_harf_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_harf_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_harf_star:before { content: "\f123"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap { width: 100%; height: auto; float: left; margin-top: 2px; margin-bottom: 2px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul { width: 100%; height: auto; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li { display: inline-block; background: #BDBDBD; color: #FFFFFF; padding-left: 10px; padding-right: 10px; border-radius: 3px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li.enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li.enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li.enable { background: #212121; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(1).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(1).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(1).enable { background: #1E88E5; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(2).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(2).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(2).enable { background: #e53935; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(3).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(3).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(3).enable { background: #7CB342; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link, #main_contents .basic_list > ul > li > .item_link { position: absolute; display: block; height: 110px; right: 7px; top: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link a, #main_contents .basic_list > ul > li > .item_link a { display: block; display: none; width: 100%; height: 100%; padding-top: 52px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link a:after, #main_contents .basic_list > ul > li > .item_link a:after { content: ">"; font-size: 120%; font-weight: bold; color: #212121; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer, #main_contents .basic_list > ul > li > .item_footer { width: 100%; height: auto; float: left; padding-left: 10px; padding-right: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn, #main_contents .basic_list > ul > li > .item_footer .btn { width: 50%; height: auto; float: left; padding: 10px; padding-top: 5px; padding-right: 5px; padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn:last-child, #main_contents .basic_list > ul > li > .item_footer .btn:last-child { padding-right: 0px; padding-left: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn a, #main_contents .basic_list > ul > li > .item_footer .btn a { display: block; width: 100%; text-align: center; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.right a, #main_contents .basic_list > ul > li > .item_footer .btn.right a { background: #ff003c; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area, #main_contents .basic_list > ul > li > .item_footer .num_area { width: 49%; height: auto; float: left; text-align: center; border: solid #BDBDBD 1px; background: #c3b159; border-radius: 3px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area:nth-child(2), #main_contents .basic_list > ul > li > .item_footer .num_area:nth-child(2) { float: right; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p, #main_contents .basic_list > ul > li > .item_footer .num_area p { display: block; width: 100%; float: left; text-align: center; font-size: 75%; padding-top: 5px; padding-bottom: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p > span, #main_contents .basic_list > ul > li > .item_footer .num_area p > span { width: 100%; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p span.counter, #main_contents .basic_list > ul > li > .item_footer .num_area p span.counter { display: inline-block; width: 95%; margin-top: 4px; font-size: 120%; font-weight: bold; letter-spacing: 1px; background: #ffebee; padding: 5px; padding-left: 10px; padding-right: 10px; text-align: center; border-radius: 3px; border: solid #ffcdd2 1px; } #main_contents .text_list { width: 100%; height: auto; float: left; } #main_contents .text_list ul { width: 100%; } #main_contents .text_list ul li { width: 100%; border-bottom: solid #E0E0E0 1px; } #main_contents .text_list ul li:last-child { border-bottom: none; } #main_contents .text_list ul li a { display: block; width: 100%; color: #212121; padding: 15px; padding-left: 20px; } #main_contents .text_list ul li a p { font-size: 0.75rem; } #main_contents .text_list ul li a p.post_at { font-size: 0.7rem; text-align: right; margin-top: 5px; color: #757575; } #main_contents .auth_img { width: 100%; height: auto; float: left; margin-bottom: 10px; } #main_contents .contents { width: 100%; height: auto; float: left; margin-bottom: 10px; padding: 10px; } #main_contents .contents h3 { font-size: 75%; color: #4a4a4a; background: #e1f3dd; margin-top: 15px; font-weight: normal; padding-left: 15px; padding-top: 5px; padding-bottom: 5px; margin-bottom: 10px; } div.num_wrap div.num_area { width: calc(100vw / 3 - 20px); border: 2px solid #000; border-radius: 10px; overflow: hidden; display: none; } #main_contents .contents h3:first-child { margin-top: 0px; } #main_contents .contents h3 span.order { margin-left: 20px; color: #212121; font-size: 80%; } .ranking_info { text-align: right; position: absolute; top: 50%; right: 12px; color: #cdcdcd; transform: translateY(-50%); } #main_contents .contents p { font-size: 75%; line-height: 1.8em; } #main_contents .contents p.detail.post_at { font-size: 0.8rem; text-align: right; margin-bottom: 5px; color: #757575; } #main_contents .contents p strong { color: #ff003c; font-weight: normal; } #main_contents .contents p.attention, #main_contents .upsell p.attention { margin-top: 10px; background: #ffebeb; padding: 15px; color: #f00; font-size: 60%; } #main_contents .upsell p.attention { margin: 15px 0; margin-top: 0; } .attention span { text-align: center; display: block; margin-bottom: 25px; padding: 10px; font-size: 120%; border-bottom: solid 1px #ffc7c7; letter-spacing: 0.13em; } #main_contents .contents .thumb { position: relative; width: 100%; height: auto; float: left; overflow: hidden; margin-bottom: 15px; } #main_contents .contents .basic_table { width: 100%; height: auto; float: left; margin-bottom: 15px; } #main_contents .contents .basic_table table { width: 100%; border-collapse: separate; border-spacing: 2px; } #main_contents .contents .basic_table table tr { width: 100%; border: solid #BDBDBD 1px; } #main_contents .contents .basic_table table tr th, #main_contents .contents .basic_table table tr td { font-size: 75%; padding: 10px; padding-left: 15px; padding-right: 15px; } #main_contents .contents .basic_table table tr th { width: 35%; background: #000000; color: #E0E0E0; font-weight: normal; text-align: right; } #main_contents .contents .basic_table table tr td { width: 65%; } #main_contents .contents .basic_table table tr td > span { color: #212121; } #main_contents .contents .basic_table table tr td a { color: #1E88E5; text-decoration: underline; } #main_contents .contents .basic_table table tr td span > span.assessment { font-size: 110%; margin-left: 5px; margin-right: 5px; color: #FFAD1C; letter-spacing: 1px; } #main_contents .contents .basic_table table tr td span > span.assessment i { font-family: FontAwesome; font-style: normal; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_star:before { content: "\f005"; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_empty_star:before { content: "\f006"; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_harf_star:before { content: "\f123"; } #main_contents .contents .basic_table table tr td input[type="text"], #main_contents .contents .basic_table table tr td select { width: 100%; padding: 5px; border: solid #BDBDBD 1px; background: #F0F0F0; border-radius: 3px; } #main_contents .contents .basic_table table tr td select { padding-top: 6px; padding-bottom: 7px; } #main_contents .form_btn button { width: 100%; padding: 10px; font-size: 100%; color: #ffffff; background-color: #e6720c; border-radius: 5px; margin-right: 10px; margin-top: 5px; } #main_contents .contents .form_btn button.send { background-color: #ff852c; } #main_contents .contents .link_btn { width: 100%; height: auto; float: left; margin-bottom: 15px; } #main_contents .contents p + .link_btn { margin-top: 15px; } #main_contents .contents .link_btn a { display: block; width: 100%; height: auto; text-align: center; padding: 15px; background: #2196F3; color: #FFFFFF; font-size: 85%; border-radius: 5px; margin-top: 15px; } #main_contents .contents .link_btn.comment a { background: #ff852c; } #main_contents .contents .link_btn.top a { background: #424242; } #main_contents .contents .link_btn.return { width: 80%; margin-left: 10%; } #main_contents .contents .link_btn.return a { padding: 7px; background: #b7b7b7; } #main_contents .contents .send_confirm { display: none; z-index: 9999; position: fixed; top: 0px; left: 0px; width: 100%; height: 120%; overflow: hidden; background: rgba(0, 0, 0, 0.8); } #main_contents .contents .send_confirm > a { display: block; width: 100%; height: 100%; float: left; } #main_contents .contents .send_confirm > a .confirm_box { width: 80%; padding: 15px; margin: 0 auto; margin-top: 50%; background: #FFFFFF; border: solid #E0E0E0 1px; border-radius: 3px; text-align: left; } #main_contents .contents .send_confirm > a .confirm_box p { color: #212121; font-size: 90%; } #main_contents .contents .send_confirm > a .confirm_box button { width: 100%; padding: 15px; color: #FFFFFF; font-size: 90%; background: #2196F3; border-radius: 5px; margin-top: 10px; } #main_contents .contents .auth_true a, #main_contents .contents .auth_true button { width: 100%; padding: 15px; margin-right: 0px; background: #2196F3; } #main_contents .contents .auth_false a, #main_contents .contents .auth_false button { background: #E0E0E0; color: #000000; font-size: 80%; } #main_contents .contents .link_btn.auth_false a { width: 50%; margin-left: 25%; padding: 5px; font-size: 70%; } #main_contents .contents h6 { font-size: 95%; line-height: 2em; color: #ef5350; margin-top: 15px; } #main_contents .contents .form input[type="text"], #main_contents .contents .form input[type="email"], #main_contents .contents .form input[type="number"], #main_contents .contents .form select, #main_contents .contents .form textarea { width: 100%; margin-bottom: 10px; padding: 8px; background: #F0F0F0; border-radius: 3px; } #main_contents .contents .form select { padding-top: 9px; padding-bottom: 10px; } #main_contents .contents .form textarea { height: 150px; resize: none; } #main_contents .footer_menu { display: none; width: 100%; height: auto; float: left; } #main_contents .footer_menu ul li { border-bottom: solid #f1ece3 1px; } #main_contents .footer_menu ul li:last-child { border-bottom: none; } #main_contents .footer_menu ul li a { position: relative; display: block; width: 100%; height: 100%; padding: 10px; padding-left: 20px; color: #272727; background: #e6e6e6; } #main_contents .footer_menu ul li a > span { font-size: 80%; } #main_contents .footer_menu ul li a > span:after { position: absolute; content: ">"; right: 10px; } .bnr_area { width: 100%; height: auto; float: left; } .bnr_area .bnr { width: 100%; height: auto; float: left; margin-bottom: 10px; } .pager { width: 100%; height: auto; float: left; padding: 2px; margin-top: 10px; margin-bottom: 10px; } .pager > strong, .pager > a { display: inline-block; width: 50px; height: auto; padding-top: 2px; padding-bottom: 2px; font-size: 85%; font-weight: bold; background: #f4f4f4; text-align: center; box-shadow: 0 0 0 1px #FFFFFF, 0 0 0 2px #d2d2d2; } .pager > a { color: #b1b1b1; font-size: 0.7rem; cursor: pointer; } .pager > a:hover, .pager > strong .active { color: #000000; } .pager > strong .active { cursor: default; } #return { z-index: 10; position: fixed; width: 60px; height: 60px; right: 10px; bottom: 10px; background: rgba(121, 108, 98, 0.8); border: 1px solid #928a86; text-align: center; cursor: pointer; overflow: hidden; border-radius: 9px; } #return a { display: block; width: 100%; height: 100%; padding-top: 18px; color: #FFFFFF; text-decoration: none; font-size: 15px; } #return a:after { content: "▲"; } #return:hover { background: rgba(49, 49, 49, 0.8); } #footer { width: 100%; height: auto; float: left; background: #4b3f3a; } #footer .copyright { width: 100%; height: auto; float: left; padding-top: 27px; padding-bottom: 27px; text-align: center; font-size: 75%; color: #E0E0E0; } #main_contents .contents { background: #fff; } #main_contents .contents p span { float: unset; } #header { background: #fff; } #header .nav_button button .bar_text, .contents_header .nav_button_footer button .bar_text { display: none; } #header > .nav_button { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb, #main_contents .basic_list > ul > li > a .list_wrap .thumb, #main_contents .basic_list > ul > li > span .list_wrap .thumb { margin: 10px; width: 130px; height: 130px; } #main_contents .basic_list > ul > li > span .list_wrap .thumb { margin: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap.thanks .thumb, #main_contents .basic_list > ul > li > a .list_wrap.thanks .thumb, #main_contents .basic_list > ul > li > span .list_wrap.thanks .thumb { width: 110px; height: 110px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info, #main_contents .basic_list > ul > li > a .list_wrap .item_info, #main_contents .basic_list > ul > li > span .list_wrap .item_info { width: calc(100% - 150px); } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap.thanks .item_info, #main_contents .basic_list > ul > li > a .list_wrap.thanks .item_info, #main_contents .basic_list > ul > li > span .list_wrap.thanks .item_info { width: calc(100% - 110px); height: 65px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .catch, #main_contents .basic_list > ul > li > a .list_wrap .item_info .catch, #main_contents .basic_list > ul > li > span .list_wrap .item_info .catch { display: inline-block; color: #ff0e0e; font-size: 1rem; margin-bottom: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info span.btn { padding: 10px 0; -webkit-transition: background-color .2s ease-in; transition: background-color .2s ease-in; border-bottom: 6px solid #1b8e22; background-color: #20ab29; color: #FFF; width: 100%; display: block; text-align: center; border-radius: 5px; float: left; font-size: 120%; letter-spacing: 0.2em; font-weight: bold; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p span.counter, #main_contents .basic_list > ul > li > .item_footer .num_area p span.counter { background: #ffffff; border: none; color: #424242; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area, #main_contents .basic_list > ul > li > .item_footer .num_area { border: none; background: #b39c74; color: #FFF; } #main_contents .contents .thumb img { width: 100%; border-radius: 20px; } #header .logo { width: 100%; padding-left: 0px; padding-right: 0px; } #header .left { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.right a, #main_contents .basic_list > ul > li > .item_footer .btn.right a { background: #ff852c; } #main_contents .contents .link_btn a { background: #00a040; } #main_contents .contents .link_btn.auth_false a { background: #E0E0E0; color: #000000; } #main_contents .contents .link_btn.comment a { background: #ff852c; } #main_contents .contents.category { position: relative; margin-bottom: 0px; } #main_contents .contents.category:after { content: ""; width: 6px; height: 6px; border: 0px; border-bottom: solid 2px #00a040; border-right: solid 2px #00a040; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 40%; right: 25px; margin-top: 0px; } #main_contents .contents.last_date { text-align: center; background: #f9f9f9; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn, #main_contents .basic_list > ul > li > .item_footer .btn { width: 100%; padding-right: 0; margin-top: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1 { width: 50%; padding-right: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2 { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer.thanks .btn, #main_contents .basic_list > ul > li > .item_footer.thanks .btn { margin-top: 0px; padding-top: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn:last-child, #main_contents .basic_list > ul > li > .item_footer .btn:last-child { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1:last-child, #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child { display: block; padding-right: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child { padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1:last-child a, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1:last-child a, #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child a, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child a { padding: 15px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a span { position: relative; left: 15px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a span::before { position: absolute; content: ""; top: 50%; left: -30px; width: 20px; height: 20px; margin-top: -10px; background: url(/images/comment.png) top left no-repeat; background-size: 20px; } #main_contents .contents .link_btn a span { position: relative; left: 15px; } #main_contents .contents .link_btn a span::before { position: absolute; content: ""; top: 50%; left: -30px; width: 20px; height: 20px; margin-top: -10px; background: url(http://woman-side.work/images/message.png) top left no-repeat; background-size: 20px; } #main_contents .maindescription { font-size: 0.75em; } #main_contents .maindescription span:not(.strong) { width: 100%; display: flex; padding: 10px; background: #efefef; margin-top: 10px; margin-bottom: 10px; } #main_contents .maindescription span.strong { font-size: 1.4em; line-height: 27px; margin-bottom: 10px; display: block; color: #ce3a37; } #main_contents .maindescription span.strong.bgs { font-size: 1em; margin-bottom: 10px; display: inline; color: #0e0e0e; padding: 1px 5px; margin: 5px; background: #FFEB3B; } #main_contents .maindescription ul.check { border: solid 2px #d8d8d8; border-radius: 8px; padding: 15px; font-size: 1.1em; line-height: 1.7em; } #main_contents .maindescription ul.check li { font-size: 1.1em; font-weight: bold; line-height: 20px; color: #292929; margin-bottom: 10px; } #main_contents .maindescription ul.check li:before { content: ''; display: inline-block; width: 16px; height: 16px; background-image: url(/images/icon_check.svg); background-size: contain; background-repeat: no-repeat; vertical-align: -3px; margin-right: 3px; } #main_contents .maindescription ul.check li:last-child { margin-bottom: 12px; } .official_link a { text-decoration: underline; color: #484848; } #main_contents .contents .basic_table table tr { border: none; } #main_contents .contents .basic_table table tr th { background: #c7b79b; color: #FFF; border-radius: 5px 0 0 5px; } #main_contents .contents .basic_table table tr td { background: #f3f3f3; } .bnr p { color: #ff0e0e; text-align: center; margin-bottom: 5px; } .bnr a { margin: 5px 0; display: block; } .upsell { padding: 15px; background: #fff7e8; display: inline-block; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a.thanks { padding: 15px 0; -webkit-transition: background-color .2s ease-in; transition: background-color .2s ease-in; border-bottom: 6px solid #1b8e22; background-color: #20ab29; } #main_contents .upsell #tab_wrap #tab_contents > div > ul > li { border-bottom: solid #fff7e8 15px; } #main_contents .upsell #tab_wrap #tab_contents > div > ul > li:last-child { border-bottom: none; } #main_contents .thanks_back { background: #4b3f3a; width: 100%; margin-bottom: 80px; } #main_contents .thanks_back .bottom_line_left, #main_contents .thanks_back .bottom_line_right { overflow: hidden; height: 60px; width: 50%; position: absolute; } #main_contents .thanks_back .bottom_line_left { left: 0; } #main_contents .thanks_back .bottom_line_right { right: 0; } #main_contents .thanks_back .bottom_line_left:before, #main_contents .thanks_back .bottom_line_right:before { content: ''; position: absolute; top: 0; width: 120%; height: 100%; margin: 0% -10% 0; background: #4b3f3a; } #main_contents .thanks_back .bottom_line_left:before { -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(10deg); -ms-transform: rotate(10deg); transform: rotate(10deg); } #main_contents .thanks_back .bottom_line_right:before { -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } #main_contents .thanks_back img { margin: 10px 0; background: #FFF; padding: 10px; border-radius: 5px 5px 0 0; margin-bottom: -5px; } #main_contents .contents p.thanks_text { text-align: center; background: #FFF; padding: 10px; border-radius: 5px; } #main_contents .thanks_back h2 { color: #FFF; text-align: center; font-size: 110%; letter-spacing: 0.2em; margin-left: 5px; margin-top: 20px; } #main_contents .thanks_back span { text-align: center; display: block; color: #FFF; margin-bottom: 30px; font-size: 80%; } #main_contents .contents p.thanks_text span { display: block; background: #ffe7e7; padding: 10px; color: #f00; margin-top: 10px; margin-bottom: 0; border-radius: 5px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info span.btn::before { background-image: url(/images/message.png); } #main_contents .contents .search_area { width: 100%; float: left; } #main_contents .contents .search_area select, #main_contents .contents .search_area input, #main_contents .contents.category select { display: inline-block; width: 32%; float: left; padding: 9px; margin-left: 0.63%; margin-right: 0.63%; background: #FFFFFF; border: solid #BDBDBD 1px; font-size: 90%; margin-bottom: 7px; } #main_contents .contents .search_area select, #main_contents .contents .search_area select option { font-size: 70%; } #main_contents .contents .search_area input { width: 32%; vertical-align: bottom; margin-top: 0; font-size: 70%; } #main_contents .contents.category select { width: 100%; border: solid #d4b046 3px; text-align: center; text-align: -webkit-center; } #main_contents .contents.category label { display: -webkit-box; display: box; box-pack: center; -webkit-box-pack: center; background-color: #fff; border: 1px solid #CCC; border-radius: 6px; cursor: pointer; } #main_contents .contents .search_area.sort { margin-top: 10px; } #main_contents .contents .search_area.sort a { display: block; width: 24.5%; float: left; border: solid #BDBDBD 1px; color: #424242; background: #FFFFFF; padding: 5px; text-align: center; font-size: 80%; border-radius: 5px; margin-right: 0.5%; } #main_contents .contents .search_area.sort a:last-child { margin-right: 0%; } #main_contents .contents .search_area.sort a.active { border: solid #d4b046 1px; color: #FFFFFF; background: #d4b046; } .search_header { width: 100%; float: left; background: #f9f9f9; margin-top: 10px; display: block; padding-top: 3px; } .search_header h2 { padding: 10px; float: left; font-weight: normal; font-size: 1rem; padding-bottom: 5px; } #main_contents .contents.category .btn-select { width: 100%; position: relative; background: #333; cursor: pointer; } #main_contents .contents.category .label { color: #424242; position: absolute; width: 100%; z-index: 1; text-align: center; border: solid #00a040 2px; padding: 8px; } #main_contents .contents.category .select { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; cursor: pointer; width: 100%; border: none; opacity: 0; position: relative; z-index: 2; margin-bottom: 0; padding-bottom: 15px; } #main_contents .contents.category .select::-ms-expand { display: none; } #main_contents .contents.category .select:focus { z-index: -1; opacity: 1; } #main_contents .window { width: 100%; margin: 0 auto; height: auto; background: #FFFFFF; padding-top: 0px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; float: left; } #main_contents .window label { background: #5bbd55; display: flex; font-size: 80%; padding-top: 5px; padding-left: 10px; padding-right: 10px; padding-bottom: 0px; overflow: auto; cursor: pointer; border-radius: 5px; } #main_contents .window .list { width: 100%; } #main_contents .window .title { line-height: 30px; color: #ffffff; letter-spacing: 0.1em; font-weight: bold; padding-bottom: 5px; position: relative; padding-left: 10px; } #main_contents .window .opentext { display: inline-block; width: 100%; padding: 10px; background: #FFF; border-radius: 5px; color: #4a4a4a; margin-bottom: 10px; } #main_contents .window .check { display: none; } #main_contents .window .opentext p img { height: 20px; width: auto; margin-right: 5px; } #main_contents .window .opentext p { font-size: 95%; margin-bottom: 15px; line-height: 20px; } #main_contents .window .opentext p.opentitle { font-size: 100%; color: #ff7c00; border-bottom: solid 3px #ffdebe; padding-bottom: 5px; margin-bottom: 15px; line-height: 20px; font-weight: bold; } #main_contents .window .opentext p.caution { font-size: 80%; color: #ff0e0e; } #main_contents .window .opentext p.end { background: #fff4f4; padding: 10px; border-radius: 5px; } #main_contents .window .opentext p.opena { background: #fff4f4; border-radius: 5px; padding: 10px; margin-top: 10px; margin-bottom: 10px; } #main_contents .window .opentext p span { margin: 0 3px; font-weight: bold; color: #e83737; } #main_contents .contents_title { background: #ffa23f; text-align: center; color: #FFF; font-size: 130%; } .article { padding: 10px; margin-bottom: 10px; background: #f7f7f7; display: inline-block; } .new_article .article { padding: 8px; } .article.non_thumb { width: 100%; } .article img { float: left; width: 50%; border-radius: 5px; } .date_name { color: #969696; font-size: 65%; padding: 0 10px; display: flex; } .new_article .date_name { float: left; } .usertag { font-size: 60%; background: #ffa23f; border-radius: 5px; padding: 0px 10px; margin-left: 10px; display: inline-block; margin-bottom: 5px; } .new_article .usertag { float: left; } .article_title { padding-left: 10px; color: #353535; font-weight: bold; height: auto; display: flex; font-size: 80%; line-height: 1.75em; } .new_article .article_title { clear: left; } .postname { color: #757575; font-size: 60%; display: inline-block; margin-left: 10px; } .view { color: #404040; font-size: 70%; padding-left: 10px; display: inline-block; } .articlepage img { border-radius: 5px; margin: 10px 0; } .usertag { font-size: 60%; background: #00a040; border-radius: 5px; padding: 0px 10px; margin-left: 10px; display: inline-block; margin-bottom: 5px; } .articlepage p { margin-bottom: 15px; } .articlepage a.blanklinks { color: #3f4fcc; font-size: 120%; text-decoration: underline; } .postname { color: #757575; font-size: 60%; display: inline-block; margin-left: 10px; } #main_contents .contents_title { background: #5bbd55; text-align: center; color: #FFF; font-size: 130%; padding-top: 12px; } .type00 { font-size: 90%; } .type01 { color: #f00; background-color: #fff400; padding: 0 5px; font-size: 120%; font-weight: bold; } .type02 { color: #f00; padding: 0 5px; font-size: 120%; font-weight: bold; } .type03 { background-color: #fff400; padding: 0 5px; font-size: 120%; font-weight: bold; } .type04 { padding: 0 5px; font-size: 120%; font-weight: bold; } .btn_animation { -webkit-animation-duration: 0.25s; animation-duration: 0.25s; -webkit-animation-delay: 0s; animation-delay: 0s; } #main_contents .contents.category:after { border-bottom: solid 2px #e4a716; border-right: solid 2px #e4a716; } #main_contents .form_btn button { width: 100%; padding: 10px; font-size: 80%; color: #040404; letter-spacing: 0.2em; font-weight: bold; background-color: #ffffff; border-radius: 35px; margin-right: 10px; margin-top: 5px; border: solid 1px #d6d6d6; } .search_header { display: none; } #main_contents .contents.category .label { border: solid #e4a716 2px; border-radius: 100px; } #main_contents .contents.last_date { background: #ffffff; } #main_contents #tab_wrap #tab_contents > div > ul > li, #main_contents .basic_list > ul > li { position: relative; width: calc(100% - 20px); float: left; border-bottom: solid #BDBDBD 1px; margin: 10px; background: #fff; } #main_contents #tab_wrap #tab_contents > div, #main_contents .basic_list { background: #ecc700; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.right a, #main_contents .basic_list > ul > li > .item_footer .btn.right a { background: none; } #main_contents #tab_wrap #tab_contents > div > ul > li > a, #main_contents .basic_list > ul > li > a, #main_contents .basic_list > ul > li > span { border-radius: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li, #main_contents .basic_list > ul > li { border-radius: 10px; border-bottom: solid #cc9d04 2px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap h3 { font-size: 1.2rem; margin-bottom: 10px; background: #fffcd3; border-bottom: solid 1px #efe6bb; margin-top: -10px; margin-left: -10px; width: calc(100% + 20px); padding: 10px; border-radius: 10px 10px 0 0; } #main_contents #tab_wrap .ranking-table td:first-child, #main_contents #tab_wrap .ranking-table th:first-child { font-size: 11px; background: #fffee6; width: 75px; } #main_contents #tab_wrap .ranking-table th { background: #fffee6; } #main_contents #tab_wrap .ranking-table td, #main_contents #tab_wrap .ranking-table th { border: solid 1px #ffe7a9; } #main_contents .contents_title { background: #fdc068; } .usertag { background: #ff8f4c; } #main_contents .contents_header { background: #a9a8a7; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb img { position: unset; top: unset; left: unset; -webkit-transform: scale(1.02); -ms-transform: scale(1.02); transform: scale(1.02); height: auto; width: 100%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb, #main_contents .basic_list > ul > li > a .list_wrap .thumb, #main_contents .basic_list > ul > li > span .list_wrap .thumb { width: calc(100% - 20px); height: auto; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info, #main_contents .basic_list > ul > li > a .list_wrap .item_info, #main_contents .basic_list > ul > li > span .list_wrap .item_info { width: 100%; min-height: 0; } #main_contents .maindescription ul.check li:last-child { margin-bottom: 0; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area, #main_contents .basic_list > ul > li > .item_footer .num_area { background: #f3c301; } #main_contents #tab_wrap .ranking-table p.thumb { width: 105px; height: 75px; border-radius: 5px; overflow: hidden; } #main_contents #tab_wrap .ranking-table td, #main_contents #tab_wrap .ranking-table th { width: 120px; } #main_contents #tab_wrap .ranking-table p { margin-top: 5px; font-weight: bold; } .switch_2 { margin: 15px 0; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail { width: 100%; } #main_contents .maindescription ul.check li { font-size: 1.0em; } #main_contents .maindescription ul.check { border: solid 1px #ffd496; background: #fffee7; border-radius: 8px; padding: 15px; font-size: 1.1em; line-height: 1.7em; } #main_contents .back_to_top_btn{ display: inline-block; width: 100%; } #main_contents .back_to_top_btn a{ display: block; width: 100%; text-align: center; padding: 10px; color: #000; text-decoration: underline; } .btn_wrap p.error { color: #D81212; font-size: 12px; margin-top: 4px; } #main_contents #tab_wrap .ranking-table tr:first-child th:first-child{ width: 60px; } .comparison_info_1 { text-align: right; margin: 0 20px; } .comparison_info_2 { text-align: right; line-height: 2px; font-size: 11px; color: #333; } .ranking_info { text-align: right; position: absolute; top: 50%; right: 12px; color: #cdcdcd; transform: translateY(-50%); } .burger_info_1 { text-align: center; padding: 0 10px; background: #e6e6e6; } .redtype { width: calc(100% - 10px); text-align: center; display: block; margin: 25px 5px 1px 5px; border: 6px solid #fe6567; padding: 10px 0; line-height: 2em; font-weight: bold; color: #5c71fa; border-radius: 5px; } span.circle:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/circle_rank.svg); background-repeat: no-repeat; } span.double_circle:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/double_circle_rank.svg); background-repeat: no-repeat; } span.triangle:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/triangle_rank.svg); background-repeat: no-repeat; } span.cross:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/cross_rank.svg); } #main_contents .maindescription ul.check li.no_check { padding: 10px; } #main_contents .maindescription ul.check li.no_check:before { background: none; display: none; } .contents, .last_date_top_image, .main:nth-child(2), .item_info, .num_area, .new_article { display: none; } .checkpoint { margin-top: 20px; margin-bottom: 30px; } .checkpoint p { line-height: 40px; font-size: 15px; font-weight: bold; margin-bottom: 13px; border-bottom: 3px solid #f3f3f3; padding-bottom: 8px; padding: 5px 15px; color: #000; } .checkpoint img { width: 40px; margin-right: 15px; line-height: 40px; position: absolute; } .right_pointtxt { margin-left: 60px; display: block; line-height: 22px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .catch { font-size: 16px; font-weight: bold; color: #CC0000; line-height: 22px; margin-bottom: 10px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .catch img { width: 90px; height: 90px; position: absolute; right: 0; bottom: 0; } #main_contents #tab_wrap #tab_contents>div>ul>li, #main_contents .basic_list>ul>li { margin: 0; width: 100%; border-radius: 0; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .thumb, #main_contents .basic_list>ul>li>a .list_wrap .thumb, #main_contents .basic_list>ul>li>span .list_wrap .thumb { width: calc(100% - 0px); height: auto; border-radius: 0; margin-left: 0; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap > h3 { padding: 8px 12px 6px; font-weight: bold; font-size: 18px; background: #333333; position: relative; display: flex; align-items: center; } #main_contents #tab_wrap #tab_contents > .footer_article { display: inline-block; margin-bottom: 20px; float: none; } .footer_article p { padding: 15px; line-height: 24px; background: #fff2d0; font-size: 16px; } .evaluation_area table { width: 100%; border-collapse: separate; border-spacing: 1px; } .evaluation_area th { padding: 15px; background: #000; text-align: center; color: #FFF; border: solid 2px #000; } .evaluation_area td { color: #000; text-align: center; padding: 15px 5px; font-weight: bold; border: solid 2px #000; font-size: 18px; } #main_contents #tab_wrap #tab_contents>div>ul>li, #main_contents .basic_list>ul>li { margin: 0; width: 100%; border-radius: 5px; padding-bottom: 5px; } #main_contents #tab_wrap #tab_contents>div>ul>li:last-child, #main_contents .basic_list>ul>li:last-child { border: 2px solid #4b4b4b; } #main_contents #tab_wrap #tab_contents>div, #main_contents .basic_list { background: #ffffff; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer .btn.switch_1, #main_contents .basic_list>ul>li>.item_footer .btn.switch_1 { width: 100%; padding: 0; } #main_contents #tab_wrap .ranking-table { background: #fff; display: inline-block; margin-left: 5px; overflow: scroll; width: calc(100% - 5px); margin-top: 20px; margin-bottom: 10px; } #main_contents #tab_wrap .ranking-table .table_wrap { overflow: scroll; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer, #main_contents .basic_list>ul>li>.item_footer { width: 100%; height: auto; float: left; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; } .balloon { position: relative; width: 100%; font-size: 12px; color: #000000; background-color: #ffffff; padding: 10px; line-height: 15px; border-radius: 3px; margin-bottom: 5px; margin-top: 0; } .balloon.b { .balloon.b aligin-items: center; box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.5); border: solid 1px #ffffff; width: calc(98% - 28px); padding: 10px; } .balloon.g { aligin-items: center; box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.5); border: solid 1px #ffffff; width: calc(98% - 28px); padding: 10px; } .usericon { position: absolute; width: auto; left: -85px; top: 50%; height: 60px; text-align: center; margin-top: -30px; } div.num_wrap { display: flex; align-items: center; justify-content: space-between; margin: 20px 10px; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer .btn.left.switch_1, #main_contents .basic_list>ul>li>.item_footer .btn.left.switch_1 { width: 50%; } img.rank_icon_list { width: auto; height: 34px; margin-right: 12px; display: inline-block; } span.userprof { display: block; opacity: 0.5; margin-bottom: 3px; } span.comment_title { display: block; font-size: 25px; margin-bottom: 20px; margin-top: 20px; border-bottom: 3px solid #000; padding-bottom: 10px; padding-right: 70px; font-weight: bold; position: relative; margin-top: 30px; padding-left: 10px; } span.userprof { display: block; opacity: 1.5; margin-bottom: -9px; } .star { color: #f1a724; } .boldcolorA { font-size: 17px; font-weight: 800; color: #f57c20; display: block; opacity: 1.5; margin-bottom: -39px; font-weight: 600; margin-left: 0px; text-align: left; } span.comment_title { display: block; font-size: 25px; margin: 0; border-bottom: 3px solid #000; padding-bottom: 10px; padding-right: 70px; font-weight: bold; position: relative; margin-top: 30px; padding-left: 10px; } img.catchicon { width: 90px; height: 90px; position: absolute; right: 0; bottom: 0; } span.comment_subtitle { display: block; font-size: 12px; opacity: 0.5; margin-bottom: 12px; padding-left: 2px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail { margin-top: 10px; padding: 0px 0; } .orange_point { padding: 0 3px; color: #ff4e08; } .iteminfo_txt { font-size: 13px; margin-bottom: 35px; } #main_contents .basic_list.comment { display: none; } #main_contents #tab_wrap .ranking-table { display: inline-block; margin-left: 0; overflow: unset; width: 100%; padding-top: 25px; padding-bottom: 1px; margin-bottom: 0; margin-top: 0; padding-left: 5px; padding-right: 5px; } #main_contents #tab_wrap .ranking-table table { table-layout: fixed; width: 160%; } #main_contents #tab_wrap .ranking-table td, #main_contents #tab_wrap .ranking-table th { width: auto; background: #FFF; } #main_contents #tab_wrap .ranking-table td:first-child, #main_contents #tab_wrap .ranking-table th:first-child { font-size: 11px; background: #fffee6; width: auto; } #main_contents #tab_wrap .ranking-table p.thumb { width: auto; height: auto; border-radius: 0; overflow: hidden; margin-top: 0; } #main_contents #tab_wrap .ranking-table td:first-child, #main_contents #tab_wrap .ranking-table th:first-child { font-size: 11px; background: #fffee6; width: auto; } span.liname { display: block; font-size: 10px; font-weight: normal; margin-bottom: 10px; color: #f57878; background: #ffd7d7; margin-left: -8px; width: calc(100% + 16px); margin-top: -12px; padding: 7px; line-height: normal; } .ranking-table font { margin-bottom: -10px; display: block; } #main_contents #tab_wrap .ranking-table td, #main_contents #tab_wrap .ranking-table th { border: solid 1px #838383; } #main_contents .window { width: 100%; margin: 0 auto; height: auto; background: #FFFFFF; padding-top: 0px; padding-left: 0; padding-right: 0; padding-bottom: 10px; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li .a_change .list_wrap h3 .title_wrap p { line-height: 1; font-size: 17px; color: #E5B902; 　　 margin-bottom: 5px; display: none; } #main_contents .window label { background: #FFF; display: flex; font-size: 80%; padding-top: 85px; padding-left: 10px; padding-right: 10px; padding-bottom: 0px; overflow: auto; cursor: pointer; border-radius: 0; } #main_contents .window .title { line-height: 30px; color: #000000; letter-spacing: 0.1em; font-weight: bold; padding-bottom: 5px; position: relative; padding-left: 10px; text-align: center; padding: 30px 0 10px 0; font-size: 15px; margin: 0 10px; } #main_contents .window .opentext { display: inline-block; width: 100%; padding: 10px; background: #FFF; border-radius: 0; color: #4a4a4a; margin-bottom: 10px; border: solid 4px #000; } :placeholder-shown { color: #BDBDBD; background: #e2e2e2; width: 100%; padding: 5px; margin-top: 5px; padding-left: 10px; } .form select { width: 100%; background: #e2e2e2; padding: 5px; margin-top: 5px; padding-left: 10px; } .form_text h2 { background: #fffcc7; margin-top: 10px; padding: 10px; font-weight: normal; line-height: 22px; font-size: 12px; } #main_contents .window .list { width: 100%; } #main_contents .contents_header { background: #808080; text-align: center; font-size: 19px; display: block; padding: 20px; } .latest_information { padding: 10px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail p { line-height: normal; margin: 0; } .comment_box { padding: 0; } .comment_box .bback { width: 100%; text-align: center; display: block; } span.bback { background: #000; color: #FFF; width: 300px; display: inline-block; padding: 15px; margin: 0 auto; margin-bottom: 30px; margin-top: 20px; font-size: 17px; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) { padding: 5px; } #footer .copyright { background: #000000; } #footer { margin-top: 30px; } .footer_article { display: inline-block; margin-bottom: -20px; margin-top: 30px; width: 100%; background: #fff2d0; } .list_img { position: relative; } .list_img img { position: absolute; width: 105px; top: -80px; z-index: 5; left: 0; right: 0; margin: auto; } #main_contents .form_btn button { width: 100%; padding: 10px; font-size: 80%; color: #ffffff; letter-spacing: 0.2em; font-weight: normal; background-color: #000000; border-radius: 0; margin-right: 10px; margin-top: 5px; border: none; font-size: 15px; } #main_contents .window .opentext p { font-size: 95%; margin-bottom: 0; line-height: 20px; background: #ffefef; padding: 10px; margin: 10px 0; } input[type="text"], textarea { background: #e2e2e2; width: 100%; padding: 5px; margin-top: 5px; padding-left: 10px; } img.rank_icon_list { width: auto; height: 28px; margin-right: 12px; display: inline-block; } .top_article_box h3 { padding: 5px; font-size: 15px; font-weight: bold; padding-left: 10px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 10px; border-left: 5px solid #43b1d6; color: #43b1d6; margin-left: 5px; margin-top: 10px; } #main_contents .contents_header h2 { font-size: 80%; color: #FFF; } span.block { margin-top: 5px; display: block; border: solid 1px #000; padding: 10px; border-radius: 3px; background: #fdffe5; } .pickup { display: inline-block; background: #ff4822; padding: 5px 5px 30px 5px; margin-bottom: -30px; } .pickup_contents { background: #FFF; padding: 10px; border: 3px solid #000; margin-bottom: 20px; } .pickup h2 { display: block; text-align: center; padding: 20px 0; font-size: 22px; color: #FFF; } .ranking_title { padding: 20px 0; text-align: center; display: block; color: #FFF; background: #000; font-size: 22px; margin-top: 30px; font-weight: bold; width: calc(100% + 20px); margin-left: -10px; } .top_article_box { border: 1px #ccc solid; padding: 10px 10px 10px 10px; box-shadow: 0 2px 3px 0 #ddd; background: #fff; font-size: 100%; line-height: 2; margin-left: 10px; margin-right: 10px; } .note { background: #fff2d0; border: solid 1px #000; color: #010101; margin: 0 20px; width: calc(100% - 40px); padding: 10px; } .top_article_box p { line-height: 32px; margin: 0; font-size: 16px; margin-bottom: 22px; } .yellow { padding: 0 3px; margin: 0 3px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 40%, #ffef00 0%); font-weight: bold; color: red; font-size: 20px; } .checkup { font-weight: bold; color: red; position: relative; padding-left: 20px; } .asterisk { font-size: 6px; width: 100%; text-align: right; display: block; } .comparison_title { display: inline-block; background: #ff4822; color: #FFF; text-align: center; padding: 20px 0; margin-bottom: -20px; margin-top: 40px; width: 100%; font-size: 22px; font-weight: bold; } #main_contents #tab_wrap .ranking-table { display: inline-block; margin-left: 0; overflow: unset; width: 100%; padding-top: 20px; padding-bottom: 1px; margin-bottom: 0; margin-top: 0; padding-left: 5px; padding-right: 5px; } #main_contents #tab_wrap .ranking-table tr th:nth-child(2) p, #main_contents #tab_wrap .ranking-table tr th:nth-child(3) p, #main_contents #tab_wrap .ranking-table tr th:nth-child(4) p { background-size: 70%; background-position: center; margin-left: 0%; height: 55px; margin: 0; } #main_contents #tab_wrap .ranking-table tr th:nth-child(2) p#main_contents #tab_wrap .ranking-table tr th:nth-child(3) p#main_contents #tab_wrap .ranking-table tr th:nth-child(4) p.pickup_contents .item_fooer p { width: calc(100% + 20px); display: block; font-size: 22px; text-align: center; border-bottom: 15px solid #000; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 900; margin-left: -10px; padding: 10px; } .pickup_contents .item_fooer img { margin-bottom: 10px; } details { width: 100%; margin-top: 30px; display: block; background: #fff; color: #000; font-size: 15px; border: #000 3px solid; } details summary:before { content: '\f054'; font-family: 'FontAwesome'; padding-right: 8px; } details p { font-size: 13px; border-top: solid 2px #ebebeb; padding: 10px; } summary { width: 100%; display: block; background: #fff; color: #000; padding: 20px; outline: none; } summary::-webkit-details-marker { display: none; } .comment_box a img { width: 100%; padding: 0 30px; display: block; margin: 20px 0; } .footer_article h2 { margin-bottom: 0; width: calc(100% + 10px); } #footer { margin-top: 0; } .footer_article p.footerballoon_l { position: relative; width: calc(100% - 160px); font-size: 16px; margin-left: 8.2em; color: #000000; background-color: #ffffff; line-height: 20px; border-radius: 0.5em; margin-bottom: 35px; margin-top: 0; box-shadow: 0 0px 5px 0 rgb(255 255 255 / 50%); } .character_l { position: absolute; width: auto; left: -7.0em; top: 50%; height: 6.5em; text-align: center; margin-top: -4.00em; } .footer_article p.footerballoon_r { position: relative; width: calc(100% - 160px); left: 30px; font-size: 16px; margin-right: 8.2em; color: #000000; background-color: #ffffff; line-height: 20px; border-radius: 0.5em; margin-bottom: 35px; margin-top: 0; box-shadow: 0 0px 5px 0 rgb(255 255 255 / 50%); } .character_r { position: absolute; width: auto; right: -7.0em; top: 50%; height: 6.5em; text-align: center; margin-top: -4.00em; } .footerballoon_l::after { content: ""; position: absolute; top: 50%; left: -20px; margin-top: 7px; border: 6px solid transparent; border-right: 15px solid #FFF; } .footerballoon_r::after { content: ""; position: absolute; top: 50%; right: -20px; margin-top: 7px; border: 6px solid transparent; border-left: 15px solid #FFF; } #main_contents #tab_wrap #tab_contents>div>ul>li>.a_change, #main_contents .basic_list>ul>li>a, #main_contents .basic_list>ul>li>span { display: block; width: 100%; float: left; font-size: 70%; color: #212121; text-decoration: none; background: #FFFFFF; border-radius: 5px; } #main_contents #tab_wrap #tab_contents>div>ul>li:nth-child(n+4) .btn.left.switch_1 { display: none; } #main_contents #tab_wrap #tab_contents>div>ul>li:nth-child(n+4) .a_change .list_wrap h3 { top: 0; } img.catchicon.department { width: auto; height: 80px; } .contents_header .nav_button_footer button .bar { margin: 4px auto 0 auto; } #main_contents .contents_header { display: none; } #footer .caution { background: #ffffff; padding: 10px; border-top: solid 1px #ffffff; } #footer .caution p { background: rgba(255, 255, 255, 0.5); padding: 10px 10px 0px; } #footer .caution p:first-child { padding-top: 15px; } #footer .caution p:last-child { padding-bottom: 15px; } #main_contents .contents_header { display: inline-block; } .footer_nav { background: #535555; text-align: center; font-size: 19px; display: block; padding: 20px; width: 100%; height: auto; float: left; } .footer_menu { display: none; width: 100%; height: auto; float: left; } .footer_menu ul li { border-bottom: solid #f1ece3 1px; } .footer_menu ul li a { background: #e6e6e6; position: relative; display: block; width: 100%; height: 100%; padding: 10px; padding-left: 20px; color: #272727; } .footer_menu ul li a>span { font-size: 80%; } .footer_menu ul li a>span:after { position: absolute; content: ">"; right: 10px; } .contents { display: block; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) a { background: #00a040; padding:14px 11px; font-size: 13px; text-align: center; border-radius: 3px; color: #fff; display: inline-block; width: 100%; line-height: 17px; border-bottom: 3px solid #126a35; } #main_contents #tab_wrap .ranking-table tr:nth-child(3) td:not(.column-1) p { font-size: 0.8rem; } #main_contents #tab_wrap .ranking-table td:first-child, #main_contents #tab_wrap .ranking-table th:first-child { background: #fbf9d8; width: 15%; } #main_contents #tab_wrap .ranking-table td a { display: block; } #main_contents #tab_wrap .ranking-table th { background: #fbf9d8; } #main_contents span.table_scroll { font-size: 11px; padding-right: 20px; display: block; text-align: right; margin-bottom: 15px; 　　 } #main_contents span.table_scroll { font-size: 11px; padding-right: 20px; display: block; text-align: right; margin-bottom: 15px; display: none; } #main_contents .contents { margin: 0; } #main_contents #tab_wrap #tab_contents>div>ul { background: #ffffff; padding: 10px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text { font-weight: bold; padding: 10px; line-height: 20px; background: #feffe0; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul.check { position: relative; margin: 1em 0; padding: 15px; width: 100%; background-color: #fff; border: 1px solid #ccc; box-shadow: 1px 2px 2px #686868; border-radius: initial; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul:before { position: absolute; content: ''; top: -15px; right: 10px; height: 50px; width: 10px; border: 3px solid #555555; background-color: none; border-radius: 12px; box-shadow: 1px 1px 2px #999; transform: rotate(10deg); z-index: 1; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul:after { position: absolute; content: ''; top: 0px; width: 10px; right: 20px; border: solid 5px #fff; z-index: 2; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul li { font-size: 14px; font-weight: bold; line-height: 20px; margin-bottom: 10px; border-bottom: 1px solid #dcdcdc; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul li.no_check { padding: 0 0 0 1em; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription ul li.no_check p { text-align: center; font-size: 17px; color: rgb(0, 100, 0); letter-spacing: 1px; } #main_contents #tab_wrap #tab_contents { margin-top: 15px; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail .main_text .maindescription h3 { font-weight: 600; font-size: 16px; margin-top: 15px; padding: 0; } .num_area { display: block; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer .btn.switch_1 { margin-top: 20px; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer .num_area p { display: block; width: 100%; float: left; text-align: center; font-size: 75%; padding-top: 12px; padding-bottom: 10px; } #main_contents #tab_wrap #tab_contents>div>ul>li .item_footer .num_area p>span { font-size: 15px; } #main_contents .maindescription ul.check li:before { background-image: url(/images/check.svg); } #main_contents #tab_wrap #tab_contents>div>ul { background: #ffffff; padding: 0px 10px; padding-top: 15px; } #main_contents #tab_wrap #tab_contents>div>ul>li, #main_contents .basic_list>ul>li { width: 100%; border-radius: 5px; padding-bottom: 15px; } #main_contents #tab_wrap .ranking-table p { font-size: 0.75rem; } #main_contents #tab_wrap .ranking-table2 p { font-size: 1.75rem; } .ranking-table font { margin-bottom: -10px; display: inline-block; } #main_contents #tab_wrap .ranking-table td { border: 1px solid #838383; vertical-align: middle; font-weight: bold; padding: 0.5em 0.1em; text-align: center; width: 90px; font-size: 11.2px; line-height: 16px; } #main_wrap .content_wrap.table table td span.double_circle:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/double_circle.svg); } #main_wrap .content_wrap.table table td span.circle:before { content: ""; width: 1rem; height: 1rem; display: inline-block; background-image: url(/images/circle_rank.svg); } .campaign_list { padding: 20px 0px 0; background: #fbf9d8; display: inline-block; width: 100%; } .campaign_list h2 { text-align: center; position: relative; font-weight: bold; } .campaign_list ul { background: #fbf9d8; } .campaign_list ul li { border-top: 1px solid #c5c5c5; padding: 10px 10px; } .campaign_list ul li:first-child { color: #fe6567; text-align: center; font-size: 18px; font-weight: bold; border-top: none; } .campaign_list ul li:last-child { border-bottom: 1px solid #c5c5c5; } .campaign_list ul li a { display: flex; } .campaign_list ul li a .campaign_left { width: 18%; } .campaign_list ul li a .campaign_left img { border-radius: 22%; } .campaign_list ul li a .campaign_right { width: 82%; color: #000; font-weight: bold; line-height: 20px; padding-left: 10px; } .campaign_list ul li a .campaign_right span { font-size: 80%; letter-spacing: 1px; } .footer_mouth { margin-top: 30px; display: inline-block; width: 100%; } .footer_mouth h2 { background: #fbf9d8; padding: 10px; border-bottom: solid 3px #fe6567; text-align: center; position: relative; font-weight: bold; } .footer_mouth .footer_mouth_text { background: #fff; } .footer_mouth .footer_mouth_text ul li.matter { padding-bottom: 30px; } .footer_mouth .footer_mouth_text ul li.matter:first-child { padding-top: 10px; } .footer_mouth .footer_mouth_text ul li.matter:last-child { border-bottom: none; padding-bottom: 0; } .footer_mouth .footer_mouth_text ul li .head { display: flex; align-items: center; margin-bottom: 0.5rem; padding: 0 10px; } .footer_mouth .footer_mouth_text ul li .head .userimage { flex: 0 0 4rem; width: 4rem; max-width: 70px; border-radius: 50%; background-color: #fff; overflow: hidden; } .footer_mouth .footer_mouth_text ul li .head .usersource { flex: 1 1 100%; width: 100%; padding-left: 1rem; font-size: 85%; line-height: 18px; } .footer_mouth .footer_mouth_text ul li .body { padding: 0 10px; } .footer_mouth .footer_mouth_text ul li .body .uservote { display: flex; align-items: flex-end; margin-bottom: 0.7rem; font-size: 80%; } .footer_mouth .footer_mouth_text ul li .body .uservote .vote { padding-bottom: 0.3rem; } .footer_mouth .footer_mouth_text ul li .body .uservote ul.list { display: flex; flex-wrap: wrap; margin-bottom: 0; margin-left: 10px; } .footer_mouth .footer_mouth_text ul li .body .uservote ul.list .item { margin-bottom: 0rem; flex: 0 0 30%; width: 28%; white-space: nowrap; line-height: 1.4em; } .footer_mouth .footer_mouth_text ul li .body .uservote .stars { display: flex; flex-wrap: nowrap; justify-content: space-between; } .footer_mouth .footer_mouth_text ul li .body .uservote .stars .star { margin-right: 0.2rem; width: 1em; height: 1em; background-position: center center; } .footer_mouth .footer_mouth_text ul li .body .usertext { background: #feffe0; border-radius: 10px; padding: 5px 15px 15px; } .footer_mouth .footer_mouth_text ul li .body .usertext h3 { padding: 10px; position: relative; font-weight: bold; background: initial; text-align: left; padding-left: 0; border: none; } .footer_mouth .footer_mouth_text ul li .body .usertext p { line-height: 1.5em; } #main_wrap .footer_mouth .footer_mouth_text ul li .body .usertext h2 { background: initial; text-align: left; padding-left: 0; border: none; } .footer_mouth .footer_mouth_text ul li .body .usertext .btn { margin-top: 15px; text-align: center; position: relative; overflow: hidden; } .footer_mouth .footer_mouth_text ul li .body .usertext .btn a { background: #00a040; border-bottom: solid #126a35 5px; color: #fff; display: inline-block; width: 100%; padding: 15px 0; border-radius: 7px; font-size: 18px; font-weight: bold; } .footer_mouth .footer_mouth_text ul li .body .usertext .btn a:before { position: absolute; content: ''; display: inline-block; top: -180px; left: 0; width: 30px; height: 100%; background-color: #fff; animation: shiny-btn1 4s ease-in-out infinite; } i.star { display: block; width: 20px; height: 22px; background-image: url(/images/star-icon.png); background-position: center top; background-size: contain; background-repeat: no-repeat; } @-webkit-keyframes shiny-btn1 { 0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; } 80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; } 81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; } 100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; } } .thumb a img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #main_contents #tab_wrap .ranking-table table.short_width { margin-bottom: 0; width: 100%; } .word_mouth h2 { font-size: 18px; color: #000; text-align: left; font-weight: bold; margin-left: 15px; } .word_mouth { position: relative; } .word_mouth .word_text ul { font-size: 0; } .word_mouth .word_text li { display: inline-block; vertical-align: middle; } .word_mouth .word_text .left { width: 50px; } .word_mouth .word_text .right { width: calc(100% - 50px); text-align: left; padding-left: 15px; line-height: 13px; } .word_mouth .word_text .right p { color: #000; font-size: 13px; letter-spacing: 1px; margin-bottom: 5px; } .word_mouth .word_text .right span { font-size: 17px; color: #f1a724; } .word_mouth .more { display: none; } .word_mouth .more.active { display: inline-block; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .word_mouth .word_text h3 { text-align: left; font-size: 14px; letter-spacing: 1px; color: #000; font-weight: normal; line-height: 23px; } .open_btn { margin: 30px 0; text-align: center; } .open_btn p { font-size: 13px; font-weight: bold; padding: 10px 50px 8px 35px; cursor: pointer; display: inline-block; color: #000; width: 100%; background: #F2F2F2; } .open_btn span { position: relative; } .open_btn p span:before { content: '口コミをもっと見る'; } .open_btn p.active span:before { content: '閉じる'; } .ys_bold { background: linear-gradient(transparent 60%, #fdff6c 60%); font-weight: 600; padding: 0 2px; } .top_article{ color: #000; } .head_title{ text-align: center; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 800; font-size: 40px; position: relative; margin-top: 30px; margin-bottom: 20px; } .head_title .small_text{ font-size: 18px; margin-bottom: -20px; display: block; } .head_title.title_4 .small_text{ line-height: 1; margin: 30px 0 16px; } .svgSample1 > svg > use:nth-of-type(1) { stroke-width: 7px; paint-order: stroke; stroke-linejoin: round; } .svgSample1 > svg > use:nth-of-type(2) { stroke-width: 0; } .svgSample1 text { font-weight: 500; font-size: 33px; font-family: 'M PLUS Rounded 1c', sans-serif; stroke: #000000; fill: #ffffff; letter-spacing: 1px; text-anchor: middle; dominant-baseline: alphabetic; } .svgSample1{ height: 50px; } .head_title.title_2{ background: #fdcc03; font-size: 25px; padding: 25px 0 15px; position: relative; } .head_title.title_2:after{ content: ""; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 15px solid white; position: absolute; top: -1px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); } .head_title.title_2 span { display: inline-block; font-size: 17px; } .head_title.title_2 .text_shadow{ font-size: 26px; } .head_title.title_2:before{ content: none; } .head_title.title_3{ font-size: 26px; font-family: 'Noto Sans JP', sans-serif; line-height: 40px; margin: 40px 0 50px; } .head_title.title_3 .svgSample1{ display: inline-block; width: 160px; } .head_title.title_3 .svgSample1 text{ font-size: 33px; } .head_title.title_4{ font-size: 28px; margin-bottom: 0; } .head_title.title_4 .text_shadow{ font-size: 40px; } .head_title.title_4 .big_text{ font-size: 40px; } .head_title.title_5{ font-size: 28px; } .head_title.title_5 .text_shadow{ font-size: 40px; width:100%; } .head_title.title_5 .big_text{ font-size: 40px; } .case_list{ text-align: center; } .case_list .title{ position: relative; display: inline-block; margin: 1.5em auto; padding: 8px 15px; color: #fff; font-size: 5.5vw; background: #000; border-radius: 10px; font-weight: 700; letter-spacing: 1px; min-width: 300px } .case_list .title:before{ content: ""; position: absolute; top: 100%; left: 50%; margin-left: -10px; border: 10px solid transparent; border-top: 13px solid #000; } .case_list ul li.case_content{ border: 2px solid #000; font-weight: 600; margin: 0 10px; background: #fff; } .case_list ul li.case_content .profile{ display: flex; align-items: center; } .case_list ul li.case_content .profile .left{ width: 40%; position: relative; } .case_list ul li.case_content .profile .left img{ width: 90px; margin: 15px 0 -7px 5vw; } .case_list ul li.case_content .profile .right{ width: 60%; text-align: left; font-size: 16px; } .case_list ul li.case_content .profile .right span{ display: block; margin-top: 10px; font-size: 20px; } .case_list ul li.case_content .case_title{ background: #000; color: #fff; padding: 10px; } .case_list ul li.case_content .main_text{ font-weight: 600; text-align: left; padding: 8px; } .case_list ul li.case_content .main_text span{ font-weight: 600; text-align: left; background: linear-gradient(transparent 40%, #FFFF00 0%); } .case_list.example{ background: #cfc6df; padding-bottom: 30px; } .case_list.example ul li.case_content .profile{ justify-content: center; } .case_list.example ul li.case_content .profile img{ height: 110px; width: auto; padding: 10px; } .case_list.example ul li.case_content .main_text{ text-align: center; } .case_list.example ul li.case_content .main_text .inner_wrap{ text-align: left; display: inline-block; } .text_shadow{ display: inline-block; z-index: 3; color: #ffffff; position: relative; font-weight: 500; font-size: 34px; text-shadow: 1px 2px 1px #000000, -2px 1.5px 1px #000000, 1px 0px 0px #000000, -2px 0px 2px #000000, 1px 0px 1px #000000, 0px 0px 1px #000000, -2px 0px 1px #000000, 0px 0px 1px #000000; font-family: 'M PLUS Rounded 1c', sans-serif; } .text_shadow.back{ position: absolute; width: 100%; color: #000; z-index: -1; top: 2px; left: -1px; } .comment_wrap{ position: relative; } .comment_wrap span{ position: absolute; top: 17vw; right: 7vw; font-size: 4vw; text-align: center; font-weight: 600; line-height: 6vw; } .merit{ display: flex; justify-content: center; margin-top: 0; } .merit .text{ text-align: center; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 500; font-size: 17px; padding: 0 10px; line-height: 1.2; } .merit .text .big_text{ font-size: 32px; font-weight: 600; background: linear-gradient(transparent 70%, #fde402 0%) } .merit .img_wrap{ width: 50px; } .merit_list{ margin: 30px 20px; padding: 15px; background: #ffffff; border-radius: 10px; display: flex; } .merit_list .left{ width: 60%; } .merit_list .left ul{ margin: 0; padding: 0; list-style-type: none; font-weight: 700; font-size: 14px; } .merit_list .left ul li{ margin: 5px 0; background: #fff; padding: 9px 10px; border-radius: 10px; height: 60px; display: flex; align-items: center; } .merit_list .right img{ margin: 0 5px; } .case_list ul li.case_content .main_text { font-weight: 600; text-align: left; padding: 8px; font-size: 14px; } .case_list ul li.case_content .profile .right span { display: block; margin-top: 8px; font-size: 17px; } p { font-size: 9px; } #main_contents #tab_wrap .ranking-table .table_wrap { overflow: scroll; } #main_contents #tab_wrap .ranking-table{ padding-left: 0px; padding-right: 0px; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) a { background: #52CE2E; padding:14px 11px; font-size: 13px; text-align: center; color: #fff; display: inline-block; width: 100%; line-height: 17px; border: 2px solid #000; border-bottom: 4px solid #000; border-radius: 50px; } .top_article div.message_wrap h2.title_wrap { font-size: 25px; } #main_contents #tab_wrap .ranking-table tr:first-child th { width: 33%; } #main_contents #tab_wrap .ranking-table p.thumb{ margin: auto; } .about-work_wrap { margin: 15px 0; padding: 15px 10px 0; } .about-work_title { font-size: 20px; text-align: center; display: flex; align-items: center; justify-content: center; padding: 0 20px 0 0; background-color: #1cc930; color: #fff; } .about-work_title img{ width: 15%; margin: 0 10px 0 0; } .about-work_p { margin: 15px 0; font-size: 15px; } .ex-work_title { font-size: 20px; text-align: center; display: flex; align-items: center; justify-content: center; background-color: #1cc930; color: #fff; } .ex-work_title img{ width: 10%; margin: 0 0 0 10px; } .ex-work_wrap { margin: 20px 0; padding: 15px; background: #e3fce6; border-radius: 10px; box-shadow: 0 0 5px #a0faaa; } .ex-work_p { margin: 10px 0; } small { font-size: 12px; color:#9a9393; display: block; padding: 0 10px; } .f-cta { display: block; width: 90%; margin : 15px auto; color:#fff; font-size: 16px; font-weight: 600; text-align: center; background-color:#06c755; } img.f-cta_img { width: 90%; margin: 0 auto 10px; display: block; } h3.ex-work_title2 { background-color: #1cc930; display: inline-block; padding: 5px 15px 3px; border-radius: 200px; color: #fff; vertical-align: bottom; } div.commnet_wrap div.comment { color:#232323; background:#def4ff; } div.commnet_wrap div.comment:after { border-right-color:#def4ff; } <!---TOPリード--------------> .head_title,.title_1{ font-size:28px; margin-bottom:15px; } .case_list .title { margin: 0px auto 15px; } .head_title.title_2 { font-size: 18px; } .head_title.title_4:before { display:none; } .head_title.title_4 { font-size: 18px; } .head_title.title_4 .text_shadow { font-size: 30px; } .head_title.title_4 .big_text { font-size: 24px; } .merit .text .big_text { font-size: 25px; } .merit_list .right img { width: 80%; margin: 0 5px; } .merit_list .left ul li { margin: 5px 0; background: #fff; padding: 10px; border-radius: 10px; height: 60px; display: flex; align-items: center; text-align: center; justify-content: center; } .head_title.title_5 { font-size: 22px; } .head_title.title_5 .text_shadow{ font-size: 30px; } div.message_wrap div.text_wrap { text-align: left; } ul.reason_wrap li div.right_wrap p { text-align: left; } .btn_animation { animation: poyoyon3 2.5s infinite; opacity: 1; display: inline-block; } @keyframes poyoyon3 { 0%, 40% { transform: skew(0deg, 0deg); } 5% { transform: skew(5deg, 5deg); } 10% { transform: skew(-4deg, -4deg); } 15% { transform: skew(3deg, 3deg); } 20% { transform: skew(-2deg, -2deg); } 25% { transform: skew(1deg, 1deg); } 30% { transform: skew(-0.6deg, -0.6deg); } 35% { transform: skew(0.3deg, 0.3deg); } } @media screen and (min-width: 960px) { body { background-color: #FFFFFF; color: #212121; } .wrap { width: 780px; margin: auto; } #wrapper { width: 100%; height: auto; float: left; } #system_message { z-index: 10000; position: fixed; left: 0; top: 0; width: 100%; height: 100%; float: left; background: rgba(0,0,0,0.9); text-align: center; } #system_message p { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 80%; height: 100px; color: #FFFFFF; font-size: 16px; } #header { width: 100%; height: auto; float: left; background: #fff; border-bottom: solid 3px #d4b046; } #header .left{ width: 20%; height: auto; float: left; padding: 8px; padding-left: 15px; } #header .logo { width: 60%; height: auto; float: left; padding: 8px; padding-left: 15px; text-align: center; } #header .logo h1 { color: #E0E0E0; font-size: 100%; font-weight: normal; line-height: 2em; } #header .logo img { width: auto; height: 40px; } #header .nav_button button .bar, .contents_header .nav_button_footer button .bar { display: block; border-top: 2px solid #FFF; width: 21px; height: 1px; margin: 4px 0 0 0; border-radius: 2px; } #header .nav_button button .bar_text, .contents_header .nav_button_footer button .bar_text { font-size: 90%; color: #000000; vertical-align: baseline; } #header .nav_menu { display: none; width: 100%; height: auto; float: left; background: #ffdbe3; } #header .nav_menu ul li { border-bottom: dotted #757575 1px; } #header .nav_menu ul li:last-child { border-bottom: none; } #header .nav_menu ul li a { position: relative; display: block; width: 100%; height: 100%; padding: 10px; padding-left: 20px; } #header .nav_menu ul li a > span { font-size: 80%; color: #000000; } #header .nav_menu ul li a > span:after { position: absolute; content: ">"; right: 10px; } #wrapper .main { width: 100%; height: auto; float: left; } #main_contents { position: relative; width: 780px; height: auto; margin: auto; float: initial; } #main_contents .contents_header { width: 100%; height: auto; float: left; padding: 10px; background: #c7b79b; } img.rank_icon { width: auto; height: 27px; margin-right: 5px; } img.rank_icon_list { width: auto; height: 18px; margin-right: 3px; vertical-align: -4px; } #sidebar .contents_header { display: none; } #main_contents .contents_header h2 { font-size: 90%; color: #FFF; } #main { width: 780px; height: auto; float: left; margin-right: 20px; margin-top: 20px; } #sidebar { width: 300px; height: auto; float: right; margin-top: 20px; } #main_contents .menu_button{ display: inline-block; margin-top: 10px; } #main_contents .menu_button img{ width: 47%; margin: 10px; float: left; } #main_contents .category_menu{ } #main_contents .category_menu h2{ font-size: 1rem; font-weight: normal; border-bottom: 1px solid #5bbd55; padding-bottom: 5px; } #main_contents #tab_wrap { width: 100%; height: auto; float: left; } #main_contents #tab_wrap .scroll_menu { width: 100%; height: auto; float: left; overflow-x: scroll; background: #ffb8c9; } #main_contents #tab_wrap .scroll_menu ul { width: 2000px; float: left; } #main_contents #tab_wrap .scroll_menu ul > li { width: 120px; float: left; list-style-type: none; } #main_contents #tab_wrap .scroll_menu ul > li a { font-size: 75%; color: #ff003c; text-decoration: none; display: block; padding-top: 10px; padding-bottom: 10px; text-align: center; width: 100%; background: #ffb8c9; } #main_contents #tab_wrap .scroll_menu ul > li a:hover, #main_contents #tab_wrap .scroll_menu ul > li a.current { background:#e30f87; color: #FFFFFF; } #main_contents #tab_wrap .ranking-table { background: #fff; display: inline-block; width: 100%; padding-top: 15px; } .ranking-table::-webkit-scrollbar{ height: 5px; } #main_contents #tab_wrap .ranking-table table{ table-layout: fixed; width: 760px; } #main_contents #tab_wrap .ranking-table .crown{ width: 80%; height: auto; } #main_contents #tab_wrap .ranking-table th{ background: #eaeaea; font-size: 1.5rem; } #main_contents #tab_wrap .ranking-table td,#main_contents #tab_wrap .ranking-table th{ border: solid 1px #a0faaa; padding: 0.5em; text-align: center; width: 90px; } #main_contents #tab_wrap .ranking-table td:first-child,#main_contents #tab_wrap .ranking-table th:first-child{ width: 60px; min-width: 60px; background: #eaeaea; font-weight: bold; } #main_contents #tab_wrap .ranking-table p{ font-weight: bold; } #main_contents #tab_wrap .ranking-table tr th:not(.column-1) p{ font-weight: bold; font-size: 1.2rem; } #main_contents #tab_wrap .ranking-table tr th:nth-child(2) p{ color: rgba(0,0,0,0); background-image: url(/images/rank_1.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr th:nth-child(3) p{ color: rgba(0,0,0,0); background-image: url(/images/rank_2.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr th:nth-child(4) p{ color: rgba(0,0,0,0); background-image: url(/images/rank_3.png); background-size: contain; background-repeat: no-repeat; margin-left: 32%; } #main_contents #tab_wrap .ranking-table tr:nth-child(3) td:not(.column-1) p{ font-weight: bold; font-size: 1.2rem; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1){ padding: 5px; } #main_contents #tab_wrap .ranking-table tr:last-child td:not(.column-1) a { display: block; background: #e6720c; color: white; font-size: 0.8rem; line-height: 1rem; padding: 7px 0; border-radius: 3px; } #main_contents #tab_wrap #tab_contents { width: 100%; height: auto; float: left; background: #FFFFFF; } #main_contents #tab_wrap #tab_contents p.none_data { text-align: center; margin-top: 20px; margin-bottom: 10px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div, #main_contents .basic_list { width: 100%; height: auto; float: left; background: #FFFFFF; } #main_contents .basic_list.comment:not(.all_list) { max-height: 600px; overflow: scroll; border: solid #E0E0E0 4px; margin-top: 10px; } #main_contents #tab_wrap #tab_contents > div > ul, #main_contents .basic_list > ul { width: 100%; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li, #main_contents .basic_list > ul > li { position: relative; width: 100%; float: left; border: solid #000 2px; margin-bottom: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li > a, #main_contents .basic_list > ul > li > a, #main_contents .basic_list > ul > li > span { display: block; width: 95%; width: 100%; float: left; font-size: 70%; color: #212121; text-decoration: none; padding: 10px; background: #FFFFFF; } #main_contents .basic_list > ul > li > span { width: 100%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap, #main_contents .basic_list > ul > li > a .list_wrap, #main_contents .basic_list > ul > li > span .list_wrap { width: 100%; height: auto; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap h3, #main_contents .basic_list > ul > li > a .list_wrap h3, #main_contents .basic_list > ul > li > span .list_wrap h3 { font-size: 1.2rem; margin-bottom: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb, #main_contents .basic_list > ul > li > a .list_wrap .thumb, #main_contents .basic_list > ul > li > span .list_wrap .thumb { position: relative; width: 110px; height: 110px; float: left; overflow: hidden; margin-top: 15px; margin-bottom: 15px; border-radius: 10px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .thumb { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info, #main_contents .basic_list > ul > li > a .list_wrap .item_info, #main_contents .basic_list > ul > li > span .list_wrap .item_info { width: 220px; width: calc(100% - 110px); height: 130px; float: left; padding-left: 20px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info { width: 100%; height: auto; padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info h3, #main_contents .basic_list > ul > li > a .list_wrap .item_info h3, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 { font-size: 140%; line-height: 1.9em; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info h3 { font-size: 120%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > a .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 a, #main_contents .basic_list > ul > li > span .list_wrap .item_info h3 span { color: #ef5350; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p, #main_contents .basic_list > ul > li > a .list_wrap .item_info p, #main_contents .basic_list > ul > li > span .list_wrap .item_info p { font-size: 100%; margin-bottom: 8px; } #main_contents .basic_list.comment > ul > li > span .list_wrap .item_info p:last-child { font-size: 95%; margin-top: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail{ display: inline-block; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail .catch{ display: inline-block; color: #ff0e0e; font-size: 1rem; margin-bottom: 10px; margin-top: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info_detail p{ line-height: 22px; font-size: 0.8rem; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment { font-size: 110%; margin-left: 5px; margin-right: 5px; color: #FFAD1C; letter-spacing: 1px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i { font-family: FontAwesome; font-style: normal; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_star:before { content: "\f005"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_empty_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_empty_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_empty_star:before { content: "\f006"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info p span.assessment i.icon_harf_star:before, #main_contents .basic_list > ul > li > a .list_wrap .item_info p span.assessment i.icon_harf_star:before, #main_contents .basic_list > ul > li > span .list_wrap .item_info p span.assessment i.icon_harf_star:before { content: "\f123"; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap { width: 100%; height: auto; float: left; margin-top: 2px; margin-bottom: 2px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul { width: 100%; height: auto; float: left; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li { display: inline-block; background: #BDBDBD; color: #FFFFFF; padding-left: 10px; padding-right: 10px; border-radius: 3px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li.enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li.enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li.enable { background: #212121; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(1).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(1).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(1).enable { background: #1E88E5; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(2).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(2).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(2).enable { background: #e53935; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .link_wrap ul li:nth-child(3).enable, #main_contents .basic_list > ul > li > a .list_wrap .item_info .link_wrap ul li:nth-child(3).enable, #main_contents .basic_list > ul > li > span .list_wrap .item_info .link_wrap ul li:nth-child(3).enable { background: #7CB342; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link, #main_contents .basic_list > ul > li > .item_link { position: absolute; display: block; height: 110px; right: 7px; top: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link a, #main_contents .basic_list > ul > li > .item_link a { display: block; display: none; width: 100%; height: 100%; padding-top: 52px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_link a:after, #main_contents .basic_list > ul > li > .item_link a:after { content: ">"; font-size: 120%; font-weight: bold; color: #212121; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer, #main_contents .basic_list > ul > li > .item_footer { width: 100%; height: auto; float: left; padding-left: 10px; padding-right: 10px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn, #main_contents .basic_list > ul > li > .item_footer .btn { width: 50%; height: auto; float: left; padding: 10px; padding-top: 5px; padding-right: 5px; padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn:last-child, #main_contents .basic_list > ul > li > .item_footer .btn:last-child { padding-right: 0px; padding-left: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn a, #main_contents .basic_list > ul > li > .item_footer .btn a { display: block; width: 100%; text-align: center; background: #424242; border-radius: 5px; padding-top: 10px; padding-bottom: 10px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a, #main_contents .basic_list > ul > li > .item_footer .btn.left a { background: #424242; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.right a, #main_contents .basic_list > ul > li > .item_footer .btn.right a { background: #ff003c; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area, #main_contents .basic_list > ul > li > .item_footer .num_area { width: 49%; height: auto; float: left; text-align: center; border: solid #BDBDBD 1px; background: #c3b159; border-radius: 3px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area:nth-child(2), #main_contents .basic_list > ul > li > .item_footer .num_area:nth-child(2) { float: right; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p, #main_contents .basic_list > ul > li > .item_footer .num_area p { display: block; width: 100%; float: left; text-align: center; font-size: 75%; padding-top: 5px; padding-bottom: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p > span, #main_contents .basic_list > ul > li > .item_footer .num_area p > span { width: 100%; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p span.counter, #main_contents .basic_list > ul > li > .item_footer .num_area p span.counter { display: inline-block; width: 95%; margin-top: 4px; font-size: 120%; font-weight: bold; letter-spacing: 1px; background: #ffebee; padding: 5px; padding-left: 10px; padding-right: 10px; text-align: center; border-radius: 3px; border: solid #ffcdd2 1px; } #main_contents .text_list { width: 100%; height: auto; float: left; } #main_contents .text_list ul { width: 100%; } #main_contents .text_list ul li { width: 100%; border-bottom: solid #E0E0E0 1px; } #main_contents .text_list ul li:last-child { border-bottom: none; } #main_contents .text_list ul li a { display: block; width: 100%; color: #212121; padding: 15px; padding-left: 20px; } #main_contents .text_list ul li a p { font-size:0.75rem; } #main_contents .text_list ul li a p.post_at { font-size:0.7rem; text-align:right; margin-top:5px; color:#757575; } #main_contents .auth_img { width: 100%; height: auto; float: left; margin-bottom: 10px; } #main_contents .contents { width: 100%; height: auto; float: left; margin-bottom: 10px; padding: 10px; } #main_contents .contents h3 { font-size: 75%; color: #4a4a4a; background: #e1f3dd; margin-top: 15px; font-weight: normal; padding-left: 15px; padding-top: 5px; padding-bottom: 5px; margin-bottom: 10px; } #main_contents .contents h3:first-child { margin-top: 0px; } #main_contents .contents h3 span.order { margin-left: 20px; color: #212121; font-size: 80%; } #main_contents .contents p { font-size: 75%; line-height: 1.8em; font-weight: bold; } #main_contents .contents p.detail.post_at { font-size:0.8rem; text-align:right; margin-bottom:5px; color:#757575; } #main_contents .contents p strong { color: #ff003c; font-weight: normal; } #main_contents .contents p.attention , #main_contents .upsell p.attention { margin-top: 10px; background: #ffebeb; padding: 15px; color: #f00; font-size: 60%; } #main_contents .upsell p.attention { margin: 15px 0; margin-top: 0; } .attention span { text-align: center; display: block; margin-bottom: 25px; padding: 10px; font-size: 120%; border-bottom: solid 1px #ffc7c7; letter-spacing: 0.13em; } #main_contents .contents .thumb { position: relative; width: 100%; height: auto; float: left; overflow: hidden; margin-bottom: 15px; } #main_contents .contents .basic_table { width: 100%; height: auto; float: left; margin-bottom: 15px; } #main_contents .contents .basic_table table { width: 100%; border-collapse: separate; border-spacing: 2px; } #main_contents .contents .basic_table table tr { width: 100%; border: solid #BDBDBD 1px; } #main_contents .contents .basic_table table tr th, #main_contents .contents .basic_table table tr td { font-size: 75%; padding: 10px; padding-left: 15px; padding-right: 15px; } #main_contents .contents .basic_table table tr th { width: 35%; background: #000000; color: #E0E0E0; font-weight: normal; text-align: right; } #main_contents .contents .basic_table table tr td { width: 65%; } #main_contents .contents .basic_table table tr td > span { color: #212121; } #main_contents .contents .basic_table table tr td a { color: #1E88E5; text-decoration: underline; } #main_contents .contents .basic_table table tr td span > span.assessment { font-size: 110%; margin-left: 5px; margin-right: 5px; color: #FFAD1C; letter-spacing: 1px; } #main_contents .contents .basic_table table tr td span > span.assessment i { font-family: FontAwesome; font-style: normal; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_star:before { content: "\f005"; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_empty_star:before { content: "\f006"; } #main_contents .contents .basic_table table tr td span > span.assessment i.icon_harf_star:before { content: "\f123"; } #main_contents .contents .basic_table table tr td input[type="text"], #main_contents .contents .basic_table table tr td select { width: 100%; padding: 5px; border: solid #BDBDBD 1px; background: #F0F0F0; border-radius: 3px; } #main_contents .contents .basic_table table tr td select { padding-top: 6px; padding-bottom: 7px; } #main_contents .form_btn button { width: 40%; padding: 10px; font-size: 80%; color: #FFFFFF; background-color: #e6720c; border-radius: 5px; margin-right: 10px; float: right; } #main_contents .contents .form_btn button.send { background-color: #ff852c; } #main_contents .contents .link_btn { width: 100%; height: auto; float: left; margin-bottom: 15px; } #main_contents .contents p + .link_btn { margin-top: 15px; } #main_contents .contents .link_btn a { display: block; width: 100%; height: auto; text-align: center; padding: 15px; background: #2196F3; color: #FFFFFF; font-size: 100%; border-radius: 5px; margin-top: 15px; } #main_contents .contents .link_btn.comment a { background: #ff852c; } #main_contents .contents .send_confirm { display: none; z-index: 9999; position: fixed; top: 0px; left: 0px; width: 100%; height: 120%; overflow: hidden; background: rgba(0, 0, 0, 0.8); } #main_contents .contents .send_confirm > a { display: block; width: 100%; height: 100%; float: left; } #main_contents .contents .send_confirm > a .confirm_box { width: 80%; padding: 15px; margin: 0 auto; margin-top: 50%; background: #FFFFFF; border: solid #E0E0E0 1px; border-radius: 3px; text-align: left; } #main_contents .contents .send_confirm > a .confirm_box p { color: #212121; font-size: 90%; } #main_contents .contents .send_confirm > a .confirm_box button { width: 100%; padding: 15px; color: #FFFFFF; font-size: 90%; background: #2196F3; border-radius: 5px; margin-top: 10px; } #main_contents .contents .auth_true a, #main_contents .contents .auth_true button { width: 100%; padding: 15px; margin-right: 0px; background: #2196F3; } #main_contents .contents .auth_false a, #main_contents .contents .auth_false button { background: #E0E0E0; color: #000000; font-size: 80%; } #main_contents .contents .link_btn.auth_false a { width: 30%; margin-left: 35%; padding: 5px; font-size: 70%; } #main_contents .contents h6 { font-size: 95%; line-height: 2em; color: #ef5350; margin-top: 15px; } #main_contents .contents .form input[type="text"], #main_contents .contents .form input[type="email"], #main_contents .contents .form input[type="number"], #main_contents .contents .form select, #main_contents .contents .form textarea { width: 100%; margin-bottom: 10px; padding: 8px; background: #F0F0F0; border-radius: 3px; } #main_contents .contents .form select { padding-top: 9px; padding-bottom: 10px; } #main_contents .contents .form textarea { height: 150px; resize: none; } #main_contents .footer_menu ul li { border-bottom: solid #f1ece3 1px; } #main_contents .footer_menu ul li:last-child { border-bottom: none; } #main_contents .footer_menu ul li a { position: relative; display: block; width: 100%; height: 100%; padding: 10px; padding-left: 20px; color: #272727; background: #e6e6e6; } #main_contents .footer_menu ul li a.active, #main_contents .footer_menu ul li a:hover { color: #FFFFFF; } #main_contents .footer_menu ul li a > span { font-size: 80%; } #main_contents .footer_menu ul li a > span:after { font-size: 120%; position: absolute; content: ">"; right: 10px; transform: scale(0.5, 1) } .bnr_area { width: 100%; height: auto; float: left; margin-bottom: 15px; } .bnr_area .bnr { width: 100%; height: auto; float: left; margin-bottom: 10px; } .bnr_area .bnr:last-child { margin-bottom: 0px; } .pager { width: 100%; height: auto; float: left; padding: 2px; margin-top: 10px; margin-bottom: 10px; } .pager > strong, .pager > a { display: inline-block; width: 50px; height: auto; padding-top: 2px; padding-bottom: 2px; font-size: 85%; font-weight: bold; background: #f4f4f4; text-align: center; box-shadow: 0 0 0 1px #FFFFFF, 0 0 0 2px #d2d2d2; } .pager > a { color: #b1b1b1; font-size: 0.7rem; cursor: pointer; } .pager > a:hover, .pager > strong .active { color: #000000; } .pager > strong .active { cursor: default; } #return { z-index: 10; position: fixed; width: 60px; height: 60px; right: 10px; bottom: 10px; background: rgba(121, 108, 98, 0.8); border: 1px solid #928a86; text-align: center; cursor: pointer; overflow: hidden; border-radius: 9px; } #return a { display: block; width: 100%; height: 100%; padding-top: 18px; color: #FFFFFF; text-decoration: none; font-size: 15px; } #return a:after { content: "▲"; } #return:hover { background: rgba(49,49,49,0.8); } #footer { width: 100%; height: auto; float: left; background: #e30f87; } #footer .copyright { width: 100%; height: auto; float: left; padding-top: 27px; padding-bottom: 27px; text-align: center; font-size: 75%; color: #E0E0E0; } #main_contents .contents { background: #f9f9f9; } #main_contents .contents p span { float: unset; } #footer .copyright { background: #4b3f3a; } #header .nav_button button .bar_text, .contents_header .nav_button_footer button .bar_text { display: none; } #header>.nav_button { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .thumb, #main_contents .basic_list > ul > li > a .list_wrap .thumb, #main_contents .basic_list > ul > li > span .list_wrap .thumb { margin: 10px; width: 180px; height: 180px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap.thanks .thumb, #main_contents .basic_list > ul > li > a .list_wrap.thanks .thumb, #main_contents .basic_list > ul > li > span .list_wrap.thanks .thumb { width: 110px; height: 110px; } #main_contents .basic_list > ul > li > a .list_wrap .thumb img, #main_contents .basic_list > ul > li > span .list_wrap.thanks .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; height: auto; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info, #main_contents .basic_list > ul > li > a .list_wrap .item_info, #main_contents .basic_list > ul > li > span .list_wrap .item_info { width: calc(100% - 200px); } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info{ display: inline-block; margin-bottom: 70px; } #main_contents .basic_list > ul > li > a .list_wrap .item_info_detail{ display: inline-block; } #main_contents .basic_list > ul > li > a .list_wrap .item_info_detail .catch{ display: inline-block; color: #ff0e0e; font-size: 1rem; margin-bottom: 10px; margin-top: 10px; } #main_contents .basic_list > ul > li > a .list_wrap .item_info_detail p{ line-height: 22px; font-size: 0.8rem; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap.thanks .item_info, #main_contents .basic_list > ul > li > a .list_wrap.thanks .item_info, #main_contents .basic_list > ul > li > span .list_wrap.thanks .item_info { width: calc(100% - 110px); height: 65px; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info .catch, #main_contents .basic_list > ul > li > a .list_wrap .item_info .catch, #main_contents .basic_list > ul > li > span .list_wrap .item_info .catch { color: #ff0e0e; line-height: 32px; font-weight: bold; display: block; float: left; width: 100%; font-size: 105%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info span.btn { padding: 10px 0; -webkit-transition: background-color .2s ease-in; transition: background-color .2s ease-in; border-bottom: 6px solid #1b8e22; background-color: #20ab29; color: #FFF; width: 100%; display: block; text-align: center; border-radius: 5px; float: left; font-size: 120%; letter-spacing: 0.2em; font-weight: bold; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area p span.counter, #main_contents .basic_list > ul > li > .item_footer .num_area p span.counter { background: #ffffff; border: none; color: #424242; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .num_area, #main_contents .basic_list > ul > li > .item_footer .num_area { border: none; background: #b39c74; color: #FFF; } #main_contents .contents .thumb img { width: 100%; } #header .logo { width: 100%; padding-left: 0px; padding-right: 0px; } #header .left { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.right a, #main_contents .basic_list > ul > li > .item_footer .btn.right a { background: #008000; } #main_contents .contents .link_btn a { background: #ff852c; } #main_contents .contents .link_btn.auth_false a { background: #E0E0E0; color: #000000; } #main_contents .contents .link_btn.comment a { background: #ff852c; } #main_contents .contents .link_btn.top a { background: #424242; } #main_contents .contents .link_btn.return { width: 50%; margin-left: 25%; } #main_contents .contents .link_btn.return a { padding: 7px; background: #757575; } #main_contents .contents.category { position: relative; margin-bottom: 0px; } #main_contents .contents.category:after { content: ""; width: 6px; height: 6px; border: 0px; border-bottom: solid 2px #00a040; border-right: solid 2px #00a040; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 30px; right: 25px; } #main_contents .contents.last_date { text-align: center; background: #f9f9f9; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn, #main_contents .basic_list > ul > li > .item_footer .btn { width: 100%; padding-right: 0; margin-top: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1 { width: 50%; padding-right: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2 { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer.thanks .btn, #main_contents .basic_list > ul > li > .item_footer.thanks .btn { margin-top: 0px; padding-top: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn:last-child, #main_contents .basic_list > ul > li > .item_footer .btn:last-child { display: none; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1:last-child, #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child { display: block; padding-right: 0px; margin-bottom: 5px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child { padding-left: 0px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_1:last-child a, #main_contents .basic_list > ul > li > .item_footer .btn.switch_1:last-child a, #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.switch_2:last-child a, #main_contents .basic_list > ul > li > .item_footer .btn.switch_2:last-child a { padding: 15px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a, #main_contents .basic_list > ul > li > .item_footer .btn.left a { background: #008000; padding-top: 15px; padding-bottom: 15px; font-size: 1em; letter-spacing: 0.15em; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a span { position: relative; left: 15px; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a span::before { position: absolute; content: ""; top: 50%; left: -30px; width: 20px; height: 20px; margin-top: -10px; background: url(/images/comment.png) top left no-repeat; background-size: 20px; } #main_contents .contents .link_btn a span { position: relative; left: 15px; } #main_contents .contents .link_btn a span::before { position: absolute; content: ""; top: 50%; left: -30px; width: 20px; height: 20px; margin-top: -10px; background: url(http://woman-side.work/images/message.png) top left no-repeat; background-size: 20px; } #main_contents .maindescription { font-size: 0.75em; } #main_contents .maindescription span:not(.strong) { width: 100%; display: block; padding: 10px; background: #efefef; margin-top: 10px; margin-bottom: 10px; } #main_contents .maindescription span.strong { color: #ef5350; font-weight: bold; line-height: 1.4rem; } #main_contents .maindescription ul.check { padding-left: 0px; } #main_contents .maindescription ul.check li { list-style-type: none; line-height: 1.4rem; } #main_contents .maindescription ul.check li:before { content: ''; display: inline-block; width: 16px; height: 16px; background-image: url(/images/icon_check.svg); background-size: contain; background-repeat: no-repeat; vertical-align: -3px; margin-right: 5px; } .official_link a{ text-decoration: underline; color: #484848; } #main_contents .contents .basic_table table tr { border: none; } #main_contents .contents .basic_table table tr th { background: #c7b79b; color: #FFF; border-radius: 5px 0 0 5px; } #main_contents .contents .basic_table table tr td { background: #f3f3f3; } .bnr p { color: #ff0e0e; text-align: center; margin-bottom: 5px; } .bnr a { display: block; } .upsell { padding: 15px; background: #fff7e8; display: inline-block; } #main_contents #tab_wrap #tab_contents > div > ul > li .item_footer .btn.left a.thanks { padding: 15px 0; -webkit-transition: background-color .2s ease-in; transition: background-color .2s ease-in; border-bottom: 6px solid #1b8e22; background-color: #20ab29; } #main_contents .upsell #tab_wrap #tab_contents > div > ul > li { border-bottom: solid #fff7e8 15px; } #main_contents .upsell #tab_wrap #tab_contents > div > ul > li:last-child { border-bottom: none; } #main_contents .thanks_back { background: #4b3f3a; width: 100%; margin-bottom: 80px; } #main_contents .thanks_back .bottom_line_left , #main_contents .thanks_back .bottom_line_right { overflow: hidden; height: 60px; width: 50%; position: absolute; } #main_contents .thanks_back .bottom_line_left { left: 0; } #main_contents .thanks_back .bottom_line_right { right: 0; } #main_contents .thanks_back .bottom_line_left:before , #main_contents .thanks_back .bottom_line_right:before { content: ''; position: absolute; top: 0; width: 120%; height: 100%; margin: 0% -10% 0; background: #4b3f3a; } #main_contents .thanks_back .bottom_line_left:before { -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transform: rotate(10deg); -ms-transform: rotate(10deg); transform: rotate(10deg); } #main_contents .thanks_back .bottom_line_right:before { -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } #main_contents .thanks_back img { margin: 10px 0; background: #FFF; padding: 10px; border-radius: 5px 5px 0 0; margin-bottom: -5px; } #main_contents .contents p.thanks_text { text-align: center; background: #FFF; padding: 10px; border-radius: 5px; } #main_contents .thanks_back h2 { color: #FFF; text-align: center; font-size: 110%; letter-spacing: 0.2em; margin-left: 5px; margin-top: 20px; } #main_contents .thanks_back span { text-align: center; display: block; color: #FFF; margin-bottom: 30px; font-size: 80%; } #main_contents .contents p.thanks_text span { display: block; background: #ffe7e7; padding: 10px; color: #f00; margin-top: 10px; margin-bottom: 0; border-radius: 5px; font-size: 90%; } #main_contents #tab_wrap #tab_contents > div > ul > li a .list_wrap .item_info span.btn::before { background-image: url(/images/message.png); } #main_contents .contents .search_area { width: 100%; float: left; } #main_contents .contents .search_area select, #main_contents .contents .search_area input, #main_contents .contents.category select { display: block; width: 16.4%; float: left; padding: 10px; margin-left: 0.13%; margin-right: 0.13%; background: #FFFFFF; border: solid #BDBDBD 1px; } #main_contents .contents .search_area select,#main_contents .contents .search_area select option{ font-size: 65%; } #main_contents .contents .search_area input { width: 33.1%; } #main_contents .contents.category select { width: 100%; } #main_contents .contents.category select { width: 100%; border: solid #d4b046 3px; text-align: center; } #main_contents .contents .search_area.sort { margin-top: 10px; } #main_contents .contents .search_area.sort a { display: block; width: 24.6%; float: left; border: solid #BDBDBD 1px; color: #424242; background: #FFFFFF; padding: 5px; text-align: center; font-size: 80%; border-radius: 5px; margin-right: 0.5%; } #main_contents .contents .search_area.sort a:last-child { margin-right: 0%; } #main_contents .contents .search_area.sort a.active { border: solid #d4b046 1px; color: #FFFFFF; background: #d4b046; } .search_header { width: 100%; float: left; background: #f9f9f9; display: block; border-top: 3px solid #e6e6e6; padding-top: 10px; } .search_header h2 { padding: 10px; float: left; font-size: 1rem; } #main_contents .contents.category .btn-select { width: 100%; position: relative; background: #333; cursor: pointer; } #main_contents .contents.category .label { color: #424242; position: absolute; width: 100%; z-index: 1; text-align: center; border: solid #00a040 2px; padding: 8px; } #main_contents .contents.category .select { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: block; cursor: pointer; width: 100%; border: none; opacity: 0; position: relative; z-index: 2; margin-bottom: 0px; padding-bottom: 15px; } #main_contents .contents.category .select::-ms-expand { display: none; } #main_contents .contents.category .select:focus { z-index: -1; opacity: 1; } #main_contents .window { width: 100%; margin: 0 auto; height: auto; background: #FFFFFF; padding-top: 0px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; float: left; } #main_contents .window label { background: #5bbd55; display: flex; font-size: 80%; padding-top: 5px; padding-left: 10px; padding-right: 10px; padding-bottom: 0px; overflow: auto; cursor: pointer; border-radius: 5px; } #main_contents .window .list { width: 100%; } #main_contents .window .title { line-height: 30px; color: #ffffff; letter-spacing: 0.1em; font-weight: bold; padding-bottom: 5px; position: relative; padding-left: 10px; } #main_contents .window .title::after { position: absolute; content: ""; top: 50%; right: 10px; width: 20px; height: 20px; margin-top: -13px; background: url(/images/plus.png) top right no-repeat; background-size: 20px; } #main_contents .window .check:checked ~ .title::after { background: url(/images/minus.png) top right no-repeat; background-size: 20px; } #main_contents .window .opentext { display:none; } #main_contents .window .check:checked ~ .opentext { display: inline-block; width: 100%; padding: 10px; background: #FFF; border-radius: 5px; color: #4a4a4a; margin-bottom: 10px; } #main_contents .window .check { display: none; } #main_contents .window .opentext p img { height: 20px; width: auto; margin-right: 5px; } #main_contents .window .opentext p { font-size: 95%; margin-bottom: 15px; line-height: 20px; } #main_contents .window .opentext p.opentitle { font-size: 100%; color: #ff7c00; border-bottom: solid 3px #ffdebe; padding-bottom: 5px; margin-bottom: 15px; line-height: 20px; font-weight: bold; } #main_contents .window .opentext p.caution { font-size: 80%; color: #ff0e0e; } #main_contents .window .opentext p.end { background: #fff4f4; padding: 10px; border-radius: 5px; } #main_contents .window .opentext p.opena { background: #fff4f4; border-radius: 5px; padding: 10px; margin-top: 10px; margin-bottom: 10px; } #main_contents .window .opentext p span { margin: 0 3px; font-weight: bold; color: #e83737; } #sidebar .article_list { width: 100%; float: left; margin-bottom: 15px; } #sidebar .article_list h3 { font-size: 85%; font-weight: normal; color: #424242; background: #FFFFFF; padding: 8px; padding-left: 15px; margin-bottom: 10px; letter-spacing: 1px; border-left: solid #ffa23f 5px; border-bottom: solid #ffa23f 1px; } #sidebar .article_list ul { width: 100%; float: left; } #sidebar .article_list ul li { width: 100%; float: left; margin-bottom: 5px; } #sidebar .article_list ul li:last-child { margin-bottom: 0px; } #sidebar .article_list ul li a { display: block; width: 100%; float: left; background: #F9F9F9; } #sidebar .article_list ul li a .thumb { position: relative; width: 110px; height: 100px; float: left; overflow: hidden; border: solid #E0E0E0 1px; } #sidebar .article_list.non_thumb ul li a .thumb { display: none; } #sidebar .article_list ul li a .thumb img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 140%; height: auto; border: solid #FFFFFF 1px; } #sidebar .article_list ul li a .text { width: 180px; float: left; padding-top: 5px; padding-left: 10px; } #sidebar .article_list.non_thumb ul li a .text { width: 290px; } #sidebar .article_list ul li a .text h4 { color: #424242; font-size: 65%; line-height: 16px; margin-top: 4px; } #sidebar .article_list ul li a .text p { color: #424242; font-size: 60%; line-height: 17px; } #sidebar .article_list ul li a .text p:first-child { color: #757575; } #sidebar .article_list ul li a .text p:nth-child(2) span { display: inline-block; color: #FFFFFF; background: #ffa23f; border-radius: 3px; padding: 2px 10px; } #sidebar .article_list ul li a .text p:last-child span:first-child { margin-right: 5px; color: #757575; } #sidebar .article_list a.view_more { display: inline-block; width: 100%; text-align: right; color: #757575; font-size: 70%; text-decoration: underline; } #sidebar .article_list a.view_more:hover { color: #212121; } .articlepage img { border-radius: 5px; margin: 10px 0; } .usertag { font-size: 60%; background: #ffa23f; border-radius: 5px; padding: 0px 10px; margin-left: 10px; display: inline-block; margin-bottom: 5px; } .articlepage p { margin-bottom: 15px; } .articlepage a.blanklinks { color: #3f4fcc; font-size: 120%; text-decoration: underline; } .postname { color: #757575; font-size: 60%; display: inline-block; margin-left: 10px; } #main_contents .contents_title { background: #ffa23f; text-align: center; color: #FFF; font-size: 130%; } .type00 { font-size: 90%; } .type01 { color: #f00; background-color: #fff400; padding: 0 5px; font-size: 120%; font-weight: bold; } .type02 { color: #f00; padding: 0 5px; font-size: 120%; font-weight: bold; } .type03 { background-color: #fff400; padding: 0 5px; font-size: 120%; font-weight: bold; } .type04 { padding: 0 5px; font-size: 120%; font-weight: bold; } body { font-size:18px } #main_contents .maindescription span.strong { font-size: 1.3em; line-height: 27px; margin-bottom: 10px; display: block; color: #ce3a37; } #main_contents .maindescription ul.check li { font-size: 1.1em; font-weight: bold; line-height: 30px; color: #292929; } #main_contents .maindescription ul.check { border: solid 2px #d8d8d8; border-radius: 8px; padding: 10px 10px 20px 10px; } #main_contents .maindescription ul.check li:last-child { margin-bottom: 12px; } #main_contents .maindescription span.strong.bgs { font-size: 1em; margin-bottom: 10px; display: inline; color: #0e0e0e; padding: 1px 5px; margin: 5px; background: #FFEB3B; } #main_contents .contents .search_area input { width: 16.4%; font-size: 65% } #main_contents .contents.category:after { border-bottom: solid 2px #e4a716; border-right: solid 2px #e4a716; } #main_contents .form_btn button { width: auto; padding: 10px 50px; font-size: 80%; color: #040404; letter-spacing: 0.2em; font-weight: bold; background-color: #ffffff; border-radius: 35px; margin-right: 10px; margin-top: 5px; border: solid 1px #d6d6d6; } #main_contents .contents.category .label { border: solid #e4a716 2px; border-radius: 100px; } #main_contents .back_to_top_btn{ display: block; text-align: center; } #main_contents .back_to_top_btn a{ background: #f3c301; border-radius: 3px; padding: 10px; display: inline-block; width: 300px; margin: 30px auto; color: #fff; text-decoration: none; } .burger_info_1 { display: none !important; } .point_wrap { padding: 15px; margin: 15px auto; background-color: #fff; border-radius: 5px; border: 2.5px solid #09978f; } .point_title { color:#333; text-align:center; font-size: 22px; font-weight:600; margin: 10px auto; letter-spacing:2px; border-bottom: 1px solid #ddd; } .point_ul { text-align: center; padding: 0px 10px; font-size: 16px; color:#333; letter-spacing:1.5px; font-weight:600; } .point_li span { display: inline-block; background-color: #09978f; padding: 7.5px 5px 10px 5px; border-radius: 50px; width: 35px; height: 35px; text-align: center; vertical-align: middle; font-size: 18px; margin: 0 10px 0 0; color:#fff; } .ranking_p { font-size: 18px; font-weight: 600; margin: 15px 0; } .caution { background-color: #fff; } .about-work_wrap { margin: 15px 0; padding: 15px 10px 0; } .about-work_title { font-size: 20px; text-align: center; display: flex; align-items: center; justify-content: center; padding: 0 20px 0 0; background-color: #1cc930; color: #fff; } .about-work_title img{ width: 15%; margin: 0 10px 0 0; } .about-work_p { margin: 15px 0; font-size: 15px; } .ex-work_title { font-size: 20px; text-align: center; display: flex; align-items: center; justify-content: center; background-color: #1cc930; color: #fff; } .ex-work_title img{ width: 10%; margin: 0 0 0 10px; } .ex-work_wrap { margin: 20px 0; padding: 15px; background: #e3fce6; border-radius: 10px; box-shadow: 0 0 5px #a0faaa; } .ex-work_p { margin: 10px 0; } small { font-size: 12px; color:#9a9393; display: block; padding: 0 10px; } .f-cta { display: block; width: 90%; margin : 15px auto; color:#fff; font-size: 16px; font-weight: 600; text-align: center; background-color:#06c755; } img.f-cta_img { width: 90%; margin: 0 auto 10px; display: block; } h3.ex-work_title2 { background-color: #1cc930; display: inline-block; padding: 5px 15px 3px; border-radius: 200px; color: #fff; vertical-align: bottom; } .head_title { text-align: center; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 800; font-size: 40px; position: relative; margin-top: 30px; margin-bottom: 20px; } .head_title .small_text { font-size: 18px; margin-bottom: -20px; display: block; } .text_shadow { display: inline-block; z-index: 3; color: #ffffff; position: relative; font-weight: 500; font-size: 34px; text-shadow: 1px 2px 1px #000000, -2px 1.5px 1px #000000, 1px 0px 0px #000000, -2px 0px 2px #000000, 1px 0px 1px #000000, 0px 0px 1px #000000, -2px 0px 1px #000000, 0px 0px 1px #000000; font-family: 'M PLUS Rounded 1c', sans-serif; } .text_shadow.back { position: absolute; width: 100%; color: #000; z-index: -1; top: 2px; left: -1px; } .case_list .title { position: relative; display: block; margin: 20px auto; padding: 8px 15px; color: #fff; font-size: 24px; background: #000; border-radius: 10px; font-weight: 700; letter-spacing: 1px; width: 60%; text-align: center; } .case_list .title:before { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -10px; border: 10px solid transparent; border-top: 13px solid #000; } .slick { display: flex; } .case_content { width: 30%; margin: 20px 1.61%; } .profile { text-align: left; display: block; margin: 15px 0; } .left img { width: 70%; display: block; margin: 0 auto; } .right { display: block; text-align: center; margin: 15px auto 0; } .right span { display: block; text-align: center; font-weight: 600; } .case_title { display: block; text-align: center; font-weight: 600; margin : 10px 0; } .main_text span { font-weight: 600; text-align: left; background: linear-gradient(transparent 40%, #FFFF00 0%); } .head_title.title_2 { background: #fdcc03; font-size: 25px; padding: 25px 0 15px; position: relative; } .head_title.title_2:after { content: ""; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-top: 15px solid white; position: absolute; top: -1px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); } .head_title.title_4 { font-size: 28px; margin-bottom: 0; } .head_title.title_4 .text_shadow { font-size: 40px; } .head_title.title_4 .small_text { line-height: 1; margin: 30px 0 16px; } .merit { display: flex; justify-content: center; margin-top: 0; } .merit .text { text-align: center; font-family: 'M PLUS Rounded 1c', sans-serif; font-weight: 500; font-size: 17px; padding: 0 10px; line-height: 1.2; } .merit .text .big_text { font-size: 32px; font-weight: 600; background: linear-gradient(transparent 70%, #fde402 0%); } .merit .img_wrap { width: 50px; } .merit_list { margin: 30px 20px; padding: 15px; background: #ffffff; border-radius: 10px; display: flex; } .merit_list .left { width: 60%; } .merit_list .left ul { margin: 0; padding: 0; list-style-type: none; font-weight: 700; font-size: 14px; } .merit_list .left ul li { margin: 5px 0; background: #fff; padding: 9px 10px; border-radius: 10px; height: 60px; display: flex; align-items: center; 　justify-content: center; text-align: center; } .right { text-align: right; } ul.reason_wrap li { display: flex; align-items: center; justify-content: flex-start; margin-top: 20px; } .title_wrap{ text-align: center; } #main form{ display: inline-block; height: auto; } div.num_wrap { margin: 20px 20px !important; } div.num_wrap div.num_area { margin-right: 20px; } div.num_wrap div.num_area:last-child { margin-right: 0; } div.word_text div.flex_wrap { justify-content: flex-start; } div.word_text div.flex_wrap div.text_wrap div.title_wrap { justify-content: flex-start; } #main_contents #tab_wrap #tab_contents>div>ul>li .a_change .list_wrap .item_info_detail p { margin-right: 20px; } } div.ranking_header div.head_wrap { background-color:#FFFFFF!important; } #main_contents #tab_wrap #tab_contents>div>ul { background : #ffffff; } div.ranking_header div.head_wrap p.label_text { background:#202020; } div.num_wrap div.num_area h3 { background:#202020; } div.item_info_detail ul { padding: 3px 16px 15px; background-color: #fffde7; border-radius: 10px; } div.item_info_detail ul { margin: 0 0px; div.item_info_detail ul2 { margin: 0 0px; div.item_info_detail ul li div.circle_wrap { background: #4b4b4b; } div.num_wrap div.num_area { border: 2px solid #4b4b4b; } div.num_wrap { display: flex; align-items: center; justify-content: space-evenly; margin: 20px 2px; } div.commnet_wrap div.img_wrap { width: 80px; margin-left: 0px; } .btn_wrap a.access_count { display: inline-block; width: calc(100% - 20px); margin: 0 10px; border: none!important; border-radius: 50px; background: #1cc930; font-size: 24px; color: #fff; text-align: center; font-weight: bold; height: 74px; line-height: 68px; position: relative; padding-right: 20px; } #main_contents #tab_wrap .ranking-table tr td:first-child { background:#202020; } #main_contents #tab_wrap .ranking-table tr:first-child th { background: #202020; } #main_contents #tab_wrap #tab_contents>div>ul>li, #main_contents .basic_list>ul>li { margin: 15px auto; } #main_contents #tab_wrap #tab_contents > div > ul > li, #main_contents .basic_list > ul > li { border-bottom: solid #4b4b4b 2px; } #main_contents #tab_wrap #tab_contents > div > ul > li { border: solid #4b4b4b 2px; } div.item_info_detail ul li div.circle_wrap { background: #e92980; } div.item_info_detail ul li div.text_wrap span { color: #e92980; } .table_scroll { display:none; } #main_contents span.table_scroll { display: none; } div.ranking_header div.head_wrap { background-color:#ffffff; } #main_contents #tab_wrap #tab_contents>div>ul { background-color:#ffffff; } div.ranking_header div.head_img { display: none; } .ranking_header { display : none; } .title_wrap { display: flex!important; align-items: center!important; justify-content: flex-start!important; background-color: #333333!important; color: #fff!important; padding: 5px 10px!important; border-radius: 600px!important; margin: 0 0 5px 0!important; } .star { color:#fdffbe; } .title-copy { font-size: 17px; color:#333333; font-weight: 600; padding: 0 15px; text-align: center; } .title-copy { font-size: 17px; color: #333333; font-weight: 600; padding: 0 15px; text-align: center; } .pink-font { color:#e92929; } .top-video { width: 95%; margin:15px auto 0; border: 4px solid #000; display: block; border-radius: 7px; } div.commnet_wrap { margin: 20px 0; } .yellow-marker { background: linear-gradient(transparent 60%, #FFFF00 0%); } .sp_attention{ font-size:10px; }