/** ----------------------------------------------------- */ /** global */ /** ----------------------------------------------------- */ body { -webkit-text-size-adjust: none !important; /*font-family: helvetica, arial, 'hiragino kaku gothic pro', meiryo, 'ms pgothic', sans-serif;*/ font-family: "Times New Roman", YuMincho, "Hiragino Mincho ProN", Meiryo, serif; background: #000; } .box_omake_button_1 {border-bottom: 1px solid #000;margin: 0 0 15px;display: inline-block;} .box_omake_button_1_wrapper {border-top: 1px solid #716860;border-bottom: 1px solid #7B6D60;background: rgba(255, 255, 255, 0.1);padding: 10px 10px;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} .box_omake_button_1_1 { } .box_omake_button_1_1_wrapper {display: table;/* width: 100%; */} .box_omake_button_1_1_1 { display: table-cell;vertical-align: middle;width: 30px;white-space: nowrap;} .box_omake_button_1_1_1_wrapper {font-size: 50px;color: #ffb90e;padding: 10px;} .box_omake_button_1_1_2 { display: table-cell; vertical-align: middle; } .box_omake_button_1_1_2_wrapper {font-size: 11px;color: #ffffff;line-height: 1.5;text-align: left;} .box_omake_button_1_1_2_wrapper p { font-weight: normal; } /** for result */ .ui_speech_bubble_2 {margin-left: 20px;background: rgba(0, 0, 0, 0.5);position: relative;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;} .ui_speech_bubble_2:before {position: absolute;left: -20px;bottom: 50%;margin: 0 0 -15px 0;width: 0;height: 0;border-top: 15px solid rgba(0, 0, 0, 0);border-right: 20px solid rgba(0, 0, 0, 0.5);border-bottom: 15px solid rgba(0, 0, 0, 0);border-left: 0px solid rgba(0, 0, 0, 0);content: '';} .ui_speech_bubble_2_wrapper { } .ui_speech_bubble_2_1 { } .ui_speech_bubble_2_1_wrapper {padding: 10px;line-height: 1.25;font-size: 11px;text-align: left;color: #ccc;} .ui_speech_bubble_2_1_wrapper p { line-height: 1.5; } .ui_speech_bubble_2_1_wrapper p:last-child { margin: 0; } .ui_speech_bubble_2_1_wrapper a {color: #f7931e;padding: 2px 5px;} @media screen and (max-width: 640px){ .ui_speech_bubble_2 { margin-top: 20px; margin-left: 0; background: rgba(0, 0, 0, 0.5); position: relative; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .ui_speech_bubble_2:before {position: absolute;left: 50%;margin: 0 0 0 -15px;top: -20px;bottom: 40%;width: 0;height: 0;border-top: 0px solid rgba(0,0,0,0);border-right: 15px solid rgba(0,0,0,0);border-bottom: 20px solid rgba(0, 0, 0, 0.5);border-left: 15px solid rgba(0,0,0,0);content: '';} .ui_speech_bubble_2_wrapper { width: 100%; } .ui_speech_bubble_2_1 { } .ui_speech_bubble_2_1_wrapper {padding: 10px;line-height: 1.25;text-align: left;} .ui_speech_bubble_2_1_wrapper p { } .ui_speech_bubble_2_1_wrapper p:last-child { } } .box_c_box_8r {word-wrap: break-word;word-break: break-all;margin: 0 0 15px;} .box_c_box_8r_wrapper {padding: 0 10px 10px;background: rgba(255, 255, 255, 0.15);border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} .box_c_box_8r_1 { } .box_c_box_8r_1_wrapper { } .box_c_box_8r_1_ul { display: table;list-style: none;margin: 0 auto;width: 100%;} .box_c_box_8r_1_li {display: block;margin: 0 0 20px;} .box_c_box_8r_1_li:last-child {margin: 0;} .box_c_box_8r_1_1 {padding: 10px 0;} .box_c_box_8r_1_1_wrapper {display: table;width: 100%;} .box_c_box_8r_1_1_1 {display: table-cell;vertical-align: middle;width: 1px;white-space: nowrap;display: none;} .box_c_box_8r_1_1_1_wrapper { text-align: center; } .box_c_box_8r_1_1_1_wrapper a {display: inline-block;background: #000000;width: 150px;border-radius: 150px;-webkit-border-radius: 150px;-moz-border-radius: 150px;overflow: hidden;} .box_c_box_8r_1_1_1_wrapper img { width: auto;height: 150px;display: block;margin: 0 auto;} .box_c_box_8r_1_1_2 {vertical-align: middle;display: table-cell;} .box_c_box_8r_1_1_2_wrapper {padding: 0;} .box_c_box_8r_1_1_2_1 {border-bottom: 1px solid rgba(255, 255, 255, 0.16);margin: 0 0 0px;} .box_c_box_8r_1_1_2_1_wrapper {text-align: left;border-bottom: 1px solid #1d1d1d;font-size: 15px;line-height: 1;padding: 5px 20px;color: #fff;} .box_c_box_8r_1_1_2_2 {} .box_c_box_8r_1_1_2_2_wrapper {text-align: left;color: #ffffff;font-size: 11px;} .box_c_box_8r_1_1_2_2_1 {margin: 0 0 5px;} .box_c_box_8r_1_1_2_2_1_wrapper {text-align: right;font-size: 15px;padding: 10px 20px;text-align: left;} .box_c_box_8r_1_1_2_2_2 {} .box_c_box_8r_1_1_2_2_2_wrapper {text-align: left;color: #C6B198;font-size: 11px;line-height: 1.5;} @media screen and (max-width: 640px){ .box_c_box_8r { } .box_c_box_8r_wrapper {padding: 0 10px;} .box_c_box_8r_1 { } .box_c_box_8r_1_wrapper { } .box_c_box_8r_1_ul { } .box_c_box_8r_1_li { } .box_c_box_8r_1_li:last-child { } .box_c_box_8r_1_1 { } .box_c_box_8r_1_1_wrapper {display: block;} .box_c_box_8r_1_1_1 {display: block;width: 100%;display: none;} .box_c_box_8r_1_1_1_wrapper {} .box_c_box_8r_1_1_1_wrapper a {display: inline-block;width: 150px;border-radius: 150px;-webkit-border-radius: 150px;-moz-border-radius: 150px;} .box_c_box_8r_1_1_1_wrapper img {height: 150px;} .box_c_box_8r_1_1_2 {display: block;} .box_c_box_8r_1_1_2_wrapper {padding: 0;} .box_c_box_8r_1_1_2_1 { } .box_c_box_8r_1_1_2_1_wrapper {padding: 5px 0;} .box_c_box_8r_1_1_2_2 {padding: 0;} .box_c_box_8r_1_1_2_2_wrapper { } .box_c_box_8r_1_1_2_2_1_wrapper {padding: 8px 0;} } .box_c_box_7 {word-wrap: break-word;word-break: break-all;margin: 0 0 5px;} .box_c_box_7_wrapper {padding: 0;} .box_c_box_7_1 {padding: 0;} .box_c_box_7_1_wrapper {/* padding: 10px; *//* border-radius: 5px; *//* -webkit-border-radius: 5px; */-moz-border-radius: 5px;/* box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8); *//* -webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8); */-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);/* background: rgba(255, 255, 255, 0.07); */} .box_c_box_7_1_ul { display: table;list-style: none;margin: 0 auto;width: 100%;} .box_c_box_7_1_li {display: block;margin: 0 0 10px;} .box_c_box_7_1_li:last-child {margin: 0;} .box_c_box_7_1_1 {border-radius: 5px;} .box_c_box_7_1_1_wrapper {display: table;width: 100%;} .box_c_box_7_1_1_1 {display: table-cell;vertical-align: middle;width: 1px;white-space: nowrap;display: none;} .box_c_box_7_1_1_1_wrapper {text-align: center;display: none;} .box_c_box_7_1_1_1_wrapper a {display: block;background: #332C29;width: 100px;border: 2px solid rgba(255, 255, 255, 0.5);border-radius: 100px;-webkit-border-radius: 100px;-moz-border-radius: 100px;overflow: hidden;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} .box_c_box_7_1_1_1_wrapper img { width: auto;height: 100px;display: block;margin: 0 auto;} .box_c_box_7_1_1_2 {vertical-align: middle;display: table-cell;} .box_c_box_7_1_1_2_wrapper {} .box_c_box_7_1_1_2_1 {border-bottom: 1px solid #7B6D60;margin: 0 0 10px;} .box_c_box_7_1_1_2_1_wrapper { text-align: left;border-bottom: 1px solid #534741;font-size: 15px;line-height: 1;padding: 5px 0;color: #fff;} .box_c_box_7_1_1_2_2 {} .box_c_box_7_1_1_2_2_wrapper {text-align: left;color: #F7931E;font-size: 11px;} @media screen and (max-width: 640px){ .box_c_box_7 { } .box_c_box_7_wrapper { } .box_c_box_7_1 { } .box_c_box_7_1_wrapper { } .box_c_box_7_1_ul { } .box_c_box_7_1_li { } .box_c_box_7_1_li:last-child { } .box_c_box_7_1_1 { } .box_c_box_7_1_1_wrapper {display: block;} .box_c_box_7_1_1_1 {display: block;width: 100%;} .box_c_box_7_1_1_1_wrapper {} .box_c_box_7_1_1_1_wrapper a {display: block;margin: 0 auto 10px;width: 100px;border-radius: 100px;-webkit-border-radius: 100px;-moz-border-radius: 100px;} .box_c_box_7_1_1_1_wrapper img {height: 100px;} .box_c_box_7_1_1_2 {display: block;} .box_c_box_7_1_1_2_wrapper {padding: 0;} .box_c_box_7_1_1_2_1 { } .box_c_box_7_1_1_2_1_wrapper { } .box_c_box_7_1_1_2_2 {padding: 0;} .box_c_box_7_1_1_2_2_wrapper { } } /** ----------------------------------------------------- */ /** z-index management */ /** ----------------------------------------------------- */ #site_loader { z-index: 10006; } #site_index { z-index: 10005; } .drawer-nav { z-index: 10004; } .drawer-hamburger { z-index: 10003; } .drawer-overlay { z-index: 10002; } #site_header { z-index: 10001; } #site_footer { z-index: 10000; } #site_main { z-index: 9999; } #site_particle { z-index: 9998; } /** ----------------------------------------------------- */ /** #site_particle */ /** ----------------------------------------------------- */ #site_particle { /*background: url("../img/img_background_site_particle.gif"); */ background: url("../img/img_background_site_no_animation.png"); /*background-size: 500px 500px;*/ position: absolute; top: 0; width: 100%; height: 100%; } /** ----------------------------------------------------- */ /** #site */ /** ----------------------------------------------------- */ #site { } #site_wrapper { background: url("../img/img_background_site.png") top center no-repeat;position: relative;overflow: hidden; position: relative;} /** ----------------------------------------------------- */ /** #site_loader */ /** ----------------------------------------------------- */ #site_loader { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: #000;} #site_loader_wrapper { width: 100%; height: 100%; font-size: 10px; color: #aaa; } #site_loader_1 { position: relative; width: 100%; height: 100%; } #site_loader_1_wrapper { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%;height: 125px; margin: auto;text-align: center; } #site_loader_1_1 { } #site_loader_1_1_wrapper { padding: 5px 0;position: relative;height: 51px; } #site_loader_1_1_1 { position: absolute; top:0; right:0; left:0; bottom:0; margin:auto; height:51px; width:100%; } #site_loader_1_1_1_wrapper { } #site_loader_1_1_2 { background: #eee;height: 1px;position: absolute;top: 10px;bottom: 0;width: 100%;margin: auto; } #site_loader_1_1_2_wrapper { height: 1px;background: #aaa;width: 0%; } #site_loader_1_2 { } #site_loader_1_2_wrapper { color: #ddd;padding: 2px 0 0; } #site_loader_1_3 { } #site_loader_1_3_wrapper { padding: 5px 0; color: #ddd; } #site_loader_1_4 { } #site_loader_1_4_wrapper { color: #ddd; } /** ----------------------------------------------------- */ /** #site_index */ /** ----------------------------------------------------- */ #site_index { /*display: none;*/ position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: #fff; } #site_index_wrapper { width: 100%; height: 100%; font-size: 10px; } #site_index_1 { position: relative; width: 100%; height: 100%; } #site_index_1_wrapper { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%;height: 125px; margin: auto;text-align: center; } #site_index_1_1 { } #site_index_1_1_wrapper { padding: 5px 0;position: relative;height: 51px; } #site_index_1_1_1 { z-index: 10001;position: absolute; top:0; right:0; left:0; bottom:0; margin:auto; height:51px; width:100%; } #site_index_1_1_1_wrapper { } #site_index_1_1_2 { z-index: 10000;background: #eee;height: 1px;position: absolute;top: 10px;bottom: 0;width: 100%;margin: auto; } #site_index_1_1_2_wrapper { height: 1px;background: #aaa;width: 0%; } #site_index_1_2 { } #site_index_1_2_wrapper {color: #888;line-height: 1.5;font-size: 11px;} #site_index_1_3 { } #site_index_1_3_wrapper { padding: 5px 0; color: #ddd; } #site_index_1_4 { } #site_index_1_4_wrapper {padding: 10px;} #site_index_1_4_wrapper a { display: inline-block; background: #ad0000; border-radius: 2px; box-shadow: 0 2px 0 rgb(90, 0, 0); color: #ffffff; font-size: 11px; font-weight: bold; text-align: center; text-decoration: none; padding: 5px 10px; } #site_main_index_last_update { } #site_main_index_last_update_wrapper { padding: 10px 0; font-size: 11px; } #site_main_index_last_update_1 { } #site_main_index_last_update_1_wrapper { margin: 0 0 10px; } #site_main_index_last_update_1_1 { margin: 0 0 20px; border-bottom: 1px solid #888; } #site_main_index_last_update_1_1_wrapper { font-size: 13px; padding: 5px 0 5px; } #site_main_index_last_update_1_2 { background: rgba(255, 255, 255, 0.15);border: 1px solid rgba(255, 255, 255, 0.15);margin: 0 0 15px 0;box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;} #site_main_index_last_update_1_2_wrapper { padding: 5px; } #site_main_index_last_update_1_2_wrapper table { width: 100%; } #site_main_index_last_update_1_2_wrapper table tbody { } #site_main_index_last_update_1_2_wrapper table tbody tr { display: block; border-top: 1px solid #555; border-bottom: 1px solid #000;} #site_main_index_last_update_1_2_wrapper table tbody tr:first-child { border-top: 0; } #site_main_index_last_update_1_2_wrapper table tbody tr:last-child { border-bottom: 0; } #site_main_index_last_update_1_2_wrapper table tbody tr td { text-align: left; padding: 5px; line-height:1.25 } #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(1) {white-space: nowrap;width: 30px;} #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(2) {white-space: nowrap;width: 70px;} #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(3) { } /** responsive */ @media screen and (max-width: 768px){ #site_main_index_last_update { } #site_main_index_last_update_wrapper { } #site_main_index_last_update_1 { } #site_main_index_last_update_1_wrapper { } #site_main_index_last_update_1_1 { } #site_main_index_last_update_1_1_wrapper { } #site_main_index_last_update_1_2 { } #site_main_index_last_update_1_2_wrapper { } #site_main_index_last_update_1_2_wrapper table { } #site_main_index_last_update_1_2_wrapper table tbody { } #site_main_index_last_update_1_2_wrapper table tbody tr { } #site_main_index_last_update_1_2_wrapper table tbody tr:first-child { } #site_main_index_last_update_1_2_wrapper table tbody tr:last-child { } #site_main_index_last_update_1_2_wrapper table tbody tr td { display: block; } #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(1) {float: right;width:70px;text-align: right;} #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(2) {padding: 5px 0 5px 0;} #site_main_index_last_update_1_2_wrapper table tbody tr td:nth-child(3) { padding: 5px 0 5px 0; border-top: 1px dotted #888; } } /** ----------------------------------------------------- */ /** #site_header */ /** ----------------------------------------------------- */ #site_header {position: fixed;height: 50px;width: 100%;background: rgba(0, 0, 0, 0.6);box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);} #site_header_wrapper { } #site_header_1 {background: url("../img/img_background_site_header_1.png") top center no-repeat;} #site_header_1_wrapper { } #site_header_1_1 { } #site_header_1_1_wrapper { } #site_header_1_1_wrapper a {display: block;/* background: red; */max-width: 218px;height: 50px;/* background: #545454; */margin:0 auto;} #site_header_1_1_wrapper a span { display: block; } /** ----------------------------------------------------- */ /** #site_menu_ui */ /** ----------------------------------------------------- */ #site_menu_ui {cursor: pointer;} #site_menu_ui_wrapper { } /** ----------------------------------------------------- */ /** #site_menu */ /** ----------------------------------------------------- */ #site_menu { color: #fff; } #site_menu_wrapper {padding: 0;color: #fff;} #site_menu_wrapper a { color: #fff; text-decoration: none; } #site_menu_1 { } #site_menu_1_wrapper { } #site_menu_1_1 { } #site_menu_1_1_wrapper {padding: 0 10px;} #site_menu_1_1_wrapper img { width: 100%; height: auto; } #site_menu_1_2 { } #site_menu_1_2_wrapper {padding: 10px 15px 0;} #site_menu_1_2_1 {margin: 0 0 5px;} #site_menu_1_2_1_wrapper {border-bottom: 1px solid #888;text-align: left;padding: 5px 0; } #site_menu_1_2_1_wrapper h4 { font-size: 14px;} #site_menu_1_2_wrapper ul li {border-bottom: 1px solid #333;} #site_menu_1_2_wrapper ul li:last-child { } #site_menu_1_2_wrapper ul li:last-child {border-bottom: 0; } #site_menu_1_2_wrapper a {display: block;border-bottom: 1px solid #000; padding: 5px 0;} #site_menu_1_2_wrapper a:hover {background: #a00; } #site_menu_1_2_wrapper a img { width: 70%; height: auto; } #site_menu_1_2_wrapper ul li:last-child a {border-bottom: 0; } #site_menu_1_3 { } #site_menu_1_3_wrapper {padding: 10px 15px;font-size: 11px;} #site_menu_1_3_1 {margin: 0 0 15px;} #site_menu_1_3_1_wrapper {border-bottom: 1px solid #888;text-align: left;padding: 5px 0; } #site_menu_1_3_1_wrapper h4 { font-size: 14px;} #site_menu_1_3_2 { } #site_menu_1_3_2_wrapper {text-align: left;color: #aaa;} #site_menu_1_3_3 { } #site_menu_1_3_3_wrapper { padding: 15px 0; } #site_menu_1_3_3_wrapper table { width: 100%;font-size: 11px; } #site_menu_1_3_3_wrapper table tbody { } #site_menu_1_3_3_wrapper table tbody tr { } #site_menu_1_3_3_wrapper table tbody tr td { } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(1) { width: 1px; white-space: nowrap; } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(2) { width: 10px; white-space: nowrap; text-align: center; } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(3) { } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(3) div:nth-child(1) { text-align: left; border-bottom: 1px solid #888; padding: 0 0 2px; } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(3) div:nth-child(2) { text-align: right; padding: 2px 0; } #site_menu_1_3_3_wrapper table tbody tr:nth-child(1) td:nth-child(3) div:nth-child(2) i { color: #55acee; } #site_menu_1_4 { } #site_menu_1_4_wrapper { padding: 0 10px; } #site_menu_1_4_wrapper img { width: 100%; height: auto; } /** ----------------------------------------------------- */ /** #site_footer */ /** ----------------------------------------------------- */ #site_footer {background: rgba(0,0,0,0.8);position: relative;} #site_footer_wrapper { color: #fff; font-size: 10px; } #site_footer_wrapper a { text-decoration: none; color: #aaa; } #site_footer_1 { max-width: 1024px; margin: 0 auto; } #site_footer_1_wrapper { padding: 10px; } #site_footer_1_1 { } #site_footer_1_1_wrapper { text-align: center; padding: 5px 0; } #site_footer_1_2 { } #site_footer_1_2_wrapper {text-align: center;font-size: 10px;padding: 10px 0;color: #aaa;} #site_footer_1_3 { } #site_footer_1_3_wrapper { text-align: center; padding: 5px 0; } #site_footer_2 { } #site_footer_2_wrapper { text-align: center; padding: 5px 0; } /** ----------------------------------------------------- */ /** #site_main */ /** ----------------------------------------------------- */ #site_main { background: url("../img/img_fx_kumonosu.png") top center no-repeat; background-size: 1280px; position: relative; } #site_main_wrapper {/* background: #000; */color: #fff;} #site_main_1 { } #site_main_1_wrapper { padding: 50px 0 0;} #site_main_1_1 { } #site_main_1_1_wrapper {position: relative;overflow: hidden;/* background: #000; */padding: 0;word-wrap: nowrap;word-break: break-all;} #site_main_top {max-width: 100%;position: absolute; height: auto;background: rgba(0,0,0,0.4); visibility: hidden;min-height: 550px;} #site_main_top.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_top_wrapper {padding: 20px 20px;} #site_main_top_1 { } #site_main_top_1_wrapper {} #site_main_top_1_wrapper img {width: 100%;height: auto;} #site_main_top_2 {} #site_main_top_2_wrapper { font-size: 10px; text-align: right; padding: 5px 0;} #site_main_top_2_wrapper a {display: block; } #site_main_top_2_wrapper a:hover { filter: alpha(opacity=80); -moz-opacity: .8; opacity: .8; } #site_main_top_2_wrapper img {width: 100%;height: auto;} #site_main_story { max-width: 100%; position: absolute; height: auto;background: rgba(0,0,0,0.4);visibility: hidden; min-height: 550px; } #site_main_story.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_story_wrapper {padding: 0 10px;} #site_main_character {max-width: 100%;position: absolute;height: auto;background: rgba(0,0,0,0.4);visibility: hidden;min-height: 550px;} #site_main_character.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_character_wrapper { padding: 10px; } #site_main_drama { max-width: 100%; position: absolute; height: auto;background: rgba(0,0,0,0.4);visibility: hidden; min-height: 550px; } #site_main_drama.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_drama_wrapper { padding: 10px; } #site_main_staff { max-width: 100%; position: absolute; height: auto;background: rgba(0,0,0,0.4);visibility: hidden; min-height: 550px; } #site_main_staff.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_staff_wrapper { padding: 10px; } #site_main_link { max-width: 100%; position: absolute; height: auto;background: rgba(0,0,0,0.4);visibility: hidden; min-height: 550px; } #site_main_link.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_link_wrapper { padding: 10px; } #site_main_omake { max-width: 100%; position: absolute; height: auto;background: rgba(0,0,0,0.4);visibility: hidden; min-height: 550px; } #site_main_omake.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_omake_wrapper { padding: 10px; } #site_main_sound {max-width: 100%;position: absolute;height: auto;background: rgba(0,0,0,0.4);visibility: hidden;min-height: 550px;} #site_main_sound.active { position: static; visibility: visible; max-width: 1024px; margin: 0 auto; } #site_main_sound_wrapper { padding: 10px; } #site_main_drama_2_1 { } #site_main_drama_2_1_wrapper { padding: 10px; text-align: right; } #site_main_drama_2_2_wrapper {padding: 300px 0;text-align: center;font-size: 12px;display: none;} #site_main_drama_2_3_wrapper { padding: 300px 10px; } #site_main_sound_1 { } #site_main_sound_1_wrapper { } #site_main_sound_1_1 { } #site_main_sound_1_1_wrapper { } #site_main_sound_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_sound_1_2 { } #site_main_sound_1_2_wrapper {padding: 10px 10px 0;margin: 0 auto;} #site_main_sound_1_2_1 { margin: 0 0 10px; } #site_main_sound_1_2_1_wrapper { } #site_main_sound_1_2_2 { } #site_main_sound_1_2_2_wrapper {text-align: right;} #site_main_sound_1_3 { } #site_main_sound_1_3_wrapper {position: relative;width: 100%;/* background: #800; */overflow: hidden;} #site_main_sound_1_3_0 { position: absolute; max-width: 640px; top: 0; right: 0; left: 0; margin: 0 auto; z-index: 4; display: none; } #site_main_sound_1_3_0_wrapper { } #site_main_sound_1_3_0_wrapper img { width: 100%; height: auto; } #site_main_sound_1_3_1 { position: absolute; max-width: 640px; top: 0; right: 0; left: 0; margin: 0 auto; z-index: 3; } #site_main_sound_1_3_1_wrapper { } #site_main_sound_1_3_1_wrapper img { width: 100%; height: auto; } #site_main_sound_1_3_2 { position: absolute; max-width: 640px; top: 0; right: 0; left: 0; margin: 0 auto; z-index: 2; } #site_main_sound_1_3_2_wrapper { } #site_main_sound_1_3_2_wrapper img { width: 100%; height: auto; } #site_main_sound_1_3_3 { position: absolute; max-width: 640px; top: 0; right: 0; left: 0; margin: 0 auto; z-index: 1; } #site_main_sound_1_3_3_wrapper { } #site_main_sound_1_3_3_wrapper img { width: 100%; height: auto; } #site_main_sound_1_4 { } #site_main_sound_1_4_wrapper {padding: 10px 10px;font-size: 11px;} #site_main_sound_1_4_wrapper a {color: #aaa;text-decoration: none;} #site_main_sound_1_4_wrapper table {margin: 0 auto;width: 100%;} #site_main_sound_1_4_wrapper table tbody tr td:nth-child(1){width:1px;white-space:nowrap;vertical-align: top;} #site_main_sound_1_4_wrapper table tbody tr td:nth-child(2){ width:1px; white-space:nowrap;vertical-align: top; padding:0 5px;} #site_main_sound_1_4_wrapper table tbody tr td div:nth-child(1){border-bottom: 1px solid #888;padding: 0 0 5px;} #site_main_sound_1_4_wrapper table tbody tr td div:nth-child(2){text-align:right;padding:5px 0;} #site_main_staff_1 { } #site_main_staff_1_wrapper { } #site_main_staff_1_1 { } #site_main_staff_1_1_wrapper { } #site_main_staff_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_staff_1_2 { } #site_main_staff_1_2_wrapper { } #site_main_staff_1_2_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_staff_1_3 { } #site_main_staff_1_3_wrapper { padding: 10px 0; font-size: 11px; } #site_main_staff_1_3_1 { } #site_main_staff_1_3_1_wrapper {margin: 0 0 10px;padding: 0 20px;} #site_main_staff_1_3_1_1 { display: none; margin: 0 0 20px; border-bottom: 1px solid #888; } #site_main_staff_1_3_1_1_wrapper { font-size: 13px; padding: 5px 0 5px; } #site_main_staff_1_3_1_2 { background: rgba(255, 255, 255, 0.15);border: 1px solid rgba(255, 255, 255, 0.15);margin: 0 0 15px 0;box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;} #site_main_staff_1_3_1_2_wrapper {padding: 15px 10px 10px;} #site_main_staff_1_3_1_2_wrapper a {color: #ccc;text-decoration: none;} #site_main_staff_1_3_1_2_wrapper table { margin: 0 auto;width: 100%; } #site_main_staff_1_3_1_2_wrapper table tbody tr td:nth-child(1) {width:1px;white-space:nowrap;vertical-align: top;text-align: right;} #site_main_staff_1_3_1_2_wrapper table tbody tr td:nth-child(2) { width:1px; white-space:nowrap;vertical-align: top; padding:0 5px; } #site_main_staff_1_3_1_2_wrapper table tbody tr td div:nth-child(1) {border-bottom: 1px dotted #888;padding: 0 0 5px;} #site_main_staff_1_3_1_2_wrapper table tbody tr td div:nth-child(2) { text-align:right;padding:5px 0; } #site_main_staff_1_4 { } #site_main_staff_1_4_wrapper { padding: 10px 0; font-size: 11px; } #site_main_staff_1_4_1 { } #site_main_staff_1_4_1_wrapper {margin: 0 0 10px;padding: 0 20px;} #site_main_staff_1_4_1_1 { display: none; margin: 0 0 20px; border-bottom: 1px solid #888; } #site_main_staff_1_4_1_1_wrapper { font-size: 13px; padding: 5px 0 5px; } #site_main_staff_1_4_1_2 { background: rgba(255, 255, 255, 0.15);border: 1px solid rgba(255, 255, 255, 0.15);margin: 0 0 15px 0;box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;} #site_main_staff_1_4_1_2_wrapper {padding: 15px 10px 10px;} #site_main_staff_1_4_1_2_wrapper a {color: #ccc;text-decoration: none;} #site_main_staff_1_4_1_2_wrapper table { margin: 0 auto;width: 100%; } #site_main_staff_1_4_1_2_wrapper table tbody tr td:nth-child(1) {width:1px;white-space:nowrap;vertical-align: top;text-align: right;} #site_main_staff_1_4_1_2_wrapper table tbody tr td:nth-child(2) { width:1px; white-space:nowrap;vertical-align: top; padding:0 5px; } #site_main_staff_1_4_1_2_wrapper table tbody tr td div:nth-child(1) {border-bottom: 1px dotted #888;padding: 0 0 5px;} #site_main_staff_1_4_1_2_wrapper table tbody tr td div:nth-child(2) { text-align:right;padding:5px 0; } #site_main_story_1 { } #site_main_story_1_wrapper { } #site_main_story_1_1 { } #site_main_story_1_1_wrapper { } #site_main_story_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_story_1_2 { } #site_main_story_1_2_wrapper { } #site_main_story_1_2_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_link_1 { } #site_main_link_1_wrapper { } #site_main_link_1_1 { } #site_main_link_1_1_wrapper { } #site_main_link_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_link_2 { } #site_main_link_2_wrapper { } #site_main_link_2_1 {margin: 0 10px 15px;border-bottom: 1px solid #888;} #site_main_link_2_1_wrapper { font-size: 13px;padding: 5px 0 5px;} #site_main_link_2_2 { max-width: 1024px;margin: 0 auto;} #site_main_link_2_2_wrapper {padding: 10px 10px 20px;} #site_main_link_3 { } #site_main_link_3_wrapper { } #site_main_link_3_1 {margin: 0 10px 15px;border-bottom: 1px solid #888;} #site_main_link_3_1_wrapper { font-size: 13px;padding: 5px 0 5px;} #site_main_link_4 { } #site_main_link_4_wrapper { } #site_main_link_4_1 {margin: 0 10px 15px;border-bottom: 1px solid #888;} #site_main_link_4_1_wrapper { font-size: 13px;padding: 5px 0 5px;} /** .link_m_box_1 */ .link_m_box_1 {background: rgba(255, 255, 255, 0.15);border: 1px solid rgba(255, 255, 255, 0.15);margin: 0 0 15px 0;box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);-moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4);border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;} .link_m_box_1:last-child { margin: 0; } .link_m_box_1_wrapper { } .link_m_box_1_1 { } .link_m_box_1_1_wrapper { display: table; width: 100%; } .link_m_box_1_1_1 { display: table-cell;vertical-align: middle;width: 50%; max-width: 500px;min-height: 80px; } .link_m_box_1_1_1_wrapper { padding: 10px; } .link_m_box_1_1_1_wrapper img { width: 100%; height: auto;display: block;margin: 0 auto; } .link_m_box_1:nth-child(1) img { max-width: 500px; } .link_m_box_1:nth-child(2) img { max-width: 400px; } .link_m_box_1:nth-child(3) img { max-width: 200px; } .link_m_box_1_1_2 {display: table-cell;vertical-align: middle;border-left: 1px solid #000;} .link_m_box_1_1_2_wrapper {padding: 20px 10px;border-left: 1px solid #555;} .link_m_box_1_1_2_1 {border-bottom: 1px solid #555;} .link_m_box_1_1_2_1_wrapper {padding: 10px 0;font-size: 13px;border-bottom: 1px solid #000;font-weight: normal;} .link_m_box_1_1_2_2 { } .link_m_box_1_1_2_2_wrapper { padding: 10px 0; } .link_m_box_1_1_2_2_wrapper pre { word-wrap: break-word; word-break: break-all; white-space: pre-wrap; overflow: auto;line-height: 1; max-height: 80px; } .link_m_box_1_1_2_2_wrapper pre code {color: #ccc;font-size: 10px;} /** responsive */ @media screen and (max-width: 768px){ .link_m_box_1_1_wrapper { } .link_m_box_1_1_1 { display: table; vertical-align: baseline; width: 100%; max-width: 100%;min-height: auto; border-right: 0;height: 120px; margin: 0 0 10px; } .link_m_box_1_1_1_wrapper { display: table-cell; vertical-align:middle; } .link_m_box_1_1_2 {display: block;border-left: 0;border-top: 1px solid #000;} .link_m_box_1_1_2_wrapper {padding: 10px;border-left: 0;border-top: 1px solid #555;} .link_m_box_1_1_2_1 { } } .box_link_o_1 { max-width: 1024px; margin: 0 auto; } .box_link_o_1_wrapper {padding: 10px 10px;} .box_link_o_1_1 { background: rgba(255, 255, 255, 0.15); border: 1px solid rgba(255, 255, 255, 0.15); margin: 0 0 15px 0; box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4); -webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.4); border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .box_link_o_1_1_wrapper {} .box_link_o_1_1_1 {display: none;margin: 0 0 10px;border-bottom: 1px solid #555;padding: 10px;} .box_link_o_1_1_1_wrapper { } .box_link_o_1_1_2 { } .box_link_o_1_1_2_wrapper { padding: 5px; font-size: 11px; } .box_link_o_1_1_2_wrapper ul { list-style: none; } .box_link_o_1_1_2_wrapper ul li { float: left;width: 25%;text-align: center;display: block;padding: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; } .box_link_o_1_1_2_wrapper ul li a { display: inline-block;word-wrap: break-word;word-break: break-all; } .box_link_o_1_1_2_wrapper ul li a:hover { filter: alpha(opacity=80); -moz-opacity: .8; opacity: .8; } .box_link_o_1_1_2_wrapper ul li a img { width: 100%; height: auto; } /** responsive */ @media screen and (max-width: 900px){ .box_link_o_1_1_2_wrapper ul li { width: 33.3%; } .box_link_o_1_1_2_wrapper ul li:nth-child(4n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(3n+1) { clear: both; } .box_link_o_1_1_2_wrapper ul li:nth-child(2n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(1n+1) { clear: inherit; } } @media screen and (max-width: 740px){ .box_link_o_1_1_2_wrapper ul li { width: 50%; } .box_link_o_1_1_2_wrapper ul li:nth-child(4n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(3n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(2n+1) { clear: both; } .box_link_o_1_1_2_wrapper ul li:nth-child(1n+1) { clear: inherit; } } @media screen and (max-width: 480px){ .box_link_o_1_1_2_wrapper ul li { width: 100%; } .box_link_o_1_1_2_wrapper ul li:nth-child(4n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(3n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(2n+1) { clear: inherit; } .box_link_o_1_1_2_wrapper ul li:nth-child(1n+1) { clear: both; } } .box_c_link_text { } .box_c_link_text a { padding: 5px;display: table; background: #000; width: 188px;margin: 0 auto;border: 1px solid #333;text-decoration: none;color: #fff; cursor: pointer; } .box_c_link_text a div { display: table-cell;vertical-align: middle;height:28px;width: 200px;margin: 0 auto; } .box_c_link_text a div span { display: block; max-height:28px; overflow:auto; } .box_c_link_text a:hover { filter: alpha(opacity=80); -moz-opacity: .8; opacity: .8; } #site_main_character_1 { } #site_main_character_1_wrapper { } #site_main_character_1_1 { } #site_main_character_1_1_wrapper { } #site_main_character_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_1_wrapper { } #site_main_character_2_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_2 { } #site_main_character_2_2_wrapper { } #site_main_character_2_2_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_3 { } #site_main_character_2_3_wrapper { } #site_main_character_2_3_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_4 { } #site_main_character_2_4_wrapper { } #site_main_character_2_4_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_5 { } #site_main_character_2_5_wrapper { } #site_main_character_2_5_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_character_2_6 { } #site_main_character_2_6_wrapper { } #site_main_character_2_6_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_drama_1 { } #site_main_drama_1_wrapper { } #site_main_drama_1_1 { } #site_main_drama_1_1_wrapper { } #site_main_drama_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_drama_2 { } #site_main_drama_2_wrapper {padding: 10px 10px;} #site_main_omake_1 { } #site_main_omake_1_wrapper { } #site_main_omake_1_1 { } #site_main_omake_1_1_wrapper { } #site_main_omake_1_1_wrapper img { display: block; max-width: 100%; height: auto; } #site_main_omake_2 { } #site_main_omake_2_wrapper { } #site_main_omake_2_1 { } #site_main_omake_2_1_wrapper {padding: 10px 0;text-align: center;font-size: 12px;} .ui_sound_state_1 { display: inline-block; font-size: 11px; } .ui_sound_state_1_wrapper { padding: 0 5px;} .ui_sound_play_button_1 { cursor: pointer; max-width: 100px; display: inline-block; } .ui_sound_play_button_1_wrapper { padding: 8px; background: #000; font-size:10px; } .ui_sound_play_button_2 { cursor: pointer; max-width: 100px; display: inline-block; } .ui_sound_play_button_2_wrapper { padding: 7px; background: #0F940A; font-size:10px; border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} .ui_sound_play_button_3 { cursor: pointer; max-width: 100px; display: inline-block; } .ui_sound_play_button_3_wrapper { padding: 7px; background: #AF0C0C; font-size:10px; border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} .ui_sound_play_button_4 { cursor: pointer; max-width: 100px; display: inline-block; } .ui_sound_play_button_4_wrapper { padding: 7px; background: #580904; font-size:10px; color: #99655C;border-radius: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-webkit-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);-moz-box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.8);} /** override | drower */ .drawer-overlay { background-color: rgba(0,0,0,0.75); } .drawer--right .drawer-hamburger, .drawer--right.drawer-open .drawer-hamburger { background: #000; filter:alpha(opacity=80); -moz-opacity: .8; opacity: .8; } .drawer-hamburger-icon, .drawer-hamburger-icon:after, .drawer-hamburger-icon:before { background-color: #fff; height: 1px; } .drawer-hamburger { width: 18px;padding: 14px 1rem 25px; } .drawer-hamburger-icon:after, .drawer-hamburger-icon:before { top: -5px; } .drawer-hamburger-icon:after { top: 5px; } .drawer-nav { background: #222; } .sm2-bar-ui { font-size: 12px; display: block; } .sm2-bar-ui .sm2-main-controls, .sm2-bar-ui .sm2-playlist-drawer { background-color: #333; } .sm2-bar-ui .sm2-inline-texture { background: transparent; } .sm2-inline-time, .sm2-inline-duration { white-space: nowrap; } .sm2-playlist-wrapper ul { overflow: hidden; } /** --------- */ /** for PAGE */ /** --------- */ /** #global_menu */ #global_menu { background: #000; } #global_menu_wrapper { font-size: 11px; } #global_menu_1 { max-width: 1024px; margin: 0 auto; } #global_menu_1_wrapper { padding: 0 10px; } #global_menu_1_wrapper ul { display: table; width: 100%; } #global_menu_1_wrapper ul li { display: table-cell; text-align: center; width: 14.286%; } #global_menu_1_wrapper ul li a { display: block; text-decoration: none; color: #fff; padding: 10px; } #global_menu_1_wrapper ul li.selected a { background: red; } #global_menu_1_wrapper ul li a:hover { background: red; }