@charset "utf-8";
/* CSS Document */

/*
Theme Name: operahouse
Theme URI: http://www.operahouse.co.jp/
Description: The original operahouse theme.
Version: 1.0
Author: Tatsuya Fujihara [operahouse.co.jp]
Tags: two colums
*/

/*-------------------- ユニバーサルセレクタ --------------------*/
* {
    margin:0;
    padding:0;
}


/*-------------------- フォントの基本設定 --------------------*/
body {
	font:12px "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
	color:#535353;
	line-height:1.6em;
	positon:relative;
}


/*-------------------- 基本リンク設定 --------------------*/
a:link,
a:visited {
	color:#535353;
	text-decoration:none;
}
a:hover ,
a:active {
	color:#b5b5b5;
	text-decoration:underline;
}

a:hover img {
	filter: alpha(opacity=50); /* IE7以下用 */
	-ms-filter: “alpha(opacity=50)”; /* IE8用 */
	opacity: 0.5; /* Firefox 1.5以上, Opera, Safari用 */
}
.no_onmouse a:hover img {
	filter: alpha(opacity=100); /* IE7以下用 */
	-ms-filter: “alpha(opacity=100)”; /* IE8用 */
	opacity: 1; /* Firefox 1.5以上, Opera, Safari用 */
}


/*-------------------- 各ページのリンク設定 --------------------*/
.top a:link ,
.top a:visited {
	color:#f25757;
}
.works a:link ,
.works a:visited {
	color:#f79710;
}
.company a:link ,
.company a:visited ,
.privacypolicy a:link ,
.privacypolicy a:visited ,
.guideline a:link ,
.guideline a:visited ,
.sct a:link ,
.sct a:visited,
.settlement a:link ,
.settlement a:visited ,
.userpolicy_otome a:link ,
.userpolicy_otome a:visited  {
	color:#88d43b;
}
.map a:link ,
.map a:visited {
	color:#4bbfd6;
}
.recruit a:link ,
.recruit a:visited {
	color:#b18ff6;
}
.contact a:link ,
.contact a:visited {
	color:#ea67a8;
}
.top a:hover ,
.top a:active ,
.works a:hover ,
.works a:active ,
.company a:hover ,
.company a:active ,
.privacypolicy a:hover ,
.privacypolicy a:active ,
.guideline a:hover ,
.guideline a:active ,
.sct a:hover ,
.sct a:active ,
.settlement a:hover ,
.settlement a:active ,
.userpolicy_otome a:hover ,
.userpolicy_otome a:active ,
.map a:hover ,
.map a:active ,
.recruit a:hover ,
.recruit a:active ,
.contact a:hover ,
.contact a:active {
	color:#d5d5d5;
}


/*-------------------- 全体に関する設定 --------------------*/
.center {
	width:860px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
}
.center_ie {
	text-align:center;
}
.clear {
	clear:both;
}
.raquo {
	margin-left:1em;
	text-indent:-1em;
}
.raquo_2 {
	margin-left:2.2em;
	text-indent:-2.2em;
}
img.outline {
	border:#d2d2d2 1px solid;
}
.caption {
	font-size: 10px;
	line-height: 1.4em;
	color: #999;
}
.align_left {
	float: left;
}
.align_right {
	float: right;
}


img , a img {
	margin: 0;
	padding: 0;
	border:0;
}


h2 {
	width: 657px;
	height: 27px;
	margin-left:13px;
	margin-bottom:20px;
	text-indent: -9999px;
}
h3 , h4 , h5 , h6 {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Arial,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	font-weight:bold;
}
h3 {
	padding-bottom:5px;
	margin-bottom:7px;
	font-size:18px;
	line-height:1.2em;
	color:#535353;
	border-bottom:1px #535353 dotted;
}
h4 {
	font-size:15px;
}
h5 {
	font-size:13px;
}
h6 {
	font-size:12px;
}

table {
	width:650px;
	border-spacing:0px;
	font:12px "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
	color:#535353;
	*font-size:small;
	*font:x-small;
	line-height:1.6em;
	positon:relative;
}
th {
	width:100px;
	padding:13px 0px 13px 0px;
	background: url(img/pattern.gif);
	text-align:center;
	vertical-align:middle;
	font-weight:normal;
	border-bottom:2px #ffffff solid;
}
td {
	padding:13px;
	text-align:left;
	vertical-align:top;
}
.th_end {
	border-bottom:none;
}


dt {
	font-weight:bold;
}
dd {
	margin-left:20px;
}
.dd_marginleft {
	margin-left:48px;
}


.color_works {
	color:#f79710;
}


.space {
	margin-bottom:8px;
}
.space_end {
	margin-bottom:43px;
}
.space_0 {
	margin-bottom:0px;
}
.space_1 {
	margin-bottom:10px;
}
.space_2 {
	margin-bottom:20px;
}
.space_3 {
	margin-bottom:30px;
}
.space_4 {
	margin-bottom:40px;
}
.space_5 {
	margin-bottom:50px;
}
.space_6 {
	margin-bottom:60px;
}
.space_7 {
	margin-bottom:70px;
}
.space_8 {
	margin-bottom:80px;
}


input ,
textarea {
	background: #fff;
	border: 1px solid #d5d5d5;
}
.wpcf7-submit {
	width:517px;
	height:20px;
	margin-top:10px;
	background:url(img/contact_send.gif) no-repeat center #fff;
	border: none;
	text-indent:-9999px;
	text-align:center;
}


.type span {
	padding: 2px 5px 3px;
	text-align:center;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Arial,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	font-size: 1.1rem;;
	line-height: 1.2em;
	color: #fff;
	background: #ccc;
	display: inline-block;
	-webkit-border-radius: 10px;   /* Safari,Google Chrome用 */
	-moz-border-radius: 10px;   /* Firefox用 */
	border-radius: 10px;   /* CSS3草案 */
	behavior: url(http://www.operahouse.co.jp/wp-content/themes/operahouse/PIE.htc);
}
.type span+span {
	margin-left: 3px;
}


.samplebtn a ,
.samplebtn a:link ,
.samplebtn a:visited {
	display: block;
	width: 60px;
	height: 15px;
	background: url(img/samplebtn.gif) 0 0 no-repeat;
	text-align: center;
	font-size: 10px;
	line-height: 14px;
	letter-spacing: 0.1em;
	margin-top: 2px;
	margin-bottom: 4px;
	color: #535353;
}
.samplebtn a:hover ,
.samplebtn a:active {
	background: url(img/samplebtn.gif) 0 -15 no-repeat;
	color: #b5b5b5;
}
.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}

/*-------------------- section --------------------*/
.section {
     clear: both;
     margin-bottom: 40px;
}
.section:last-child {
     margin-bottom: 0;
}
.section p:last-child {
     margin-bottom: 0;
}


/*-------------------- unit --------------------*/
.unit {
     clear: both;
     overflow: hidden;
     zoom: 1;
}

.col2_ab .box:nth-of-type(1) {
     float: left;
}
.col2_ab .box:nth-of-type(2) {
     padding: 0 0 0 20px;
     overflow: hidden;
     zoom: 1;
}
.col2_ba .box:nth-of-type(1) {
     float: right;
}
.col2_ba .box:nth-of-type(2) {
     padding: 0 20px 0 0;
     overflow: hidden;
     zoom: 1;
}
.col2_ab .box:nth-of-type(2) p:last-child ,
.col2_ba .box:nth-of-type(2) p:last-child {
     margin-bottom:0;
}

.colx .box {
     float: left;
     margin-right: 20px;
     width: ;
}
.colx .box:last-child {
     margin-right: 0;
}


/*-------------------- wrapper --------------------*/
#wrapper {
}


/*-------------------- header --------------------*/
#header {
	padding-bottom:0px;
	height:74px;
}
#logo {
	margin: 14px 0 0 0;
}
#navi {
	float: right;
}
#navi li {
	margin: 5px;
	height: 74px;
}
#navi a {
	float:left;
	width: 80px;
	height: 74px;
	display: block;
	text-indent: -9999px;
}
#navi .top a {
	background: url(img/navi_top.png) center no-repeat;
}
#navi li.top {
	background: #ed4e4e;
}
#navi .works a {
	background: url(img/navi_works.png) center no-repeat;
}
#navi li.works {
	background: #f29c24;
}
#navi .company a {
	background: url(img/navi_company.png) center no-repeat;
}
#navi li.company {
	background: #8fcf4e;
}
#navi .map a {
	background: url(img/navi_map.png) center no-repeat;
}
#navi li.map {
	background: #50bed4;
}
#navi .recruit a {
	background: url(img/navi_recruit.png) center no-repeat;
}
#navi li.recruit {
	background: #9371d9;
}
#navi .contact a {
	background: url(img/navi_contact.png) center no-repeat;
}
#navi li.contact {
	background: #e65ca1;
}


/*-------------------- content --------------------*/
#content {
	margin-bottom:0px;
}


/*-------------------- topimg --------------------*/
#topimg {
	margin-top:30px;
	width:860px;
}
#topimg p {
	float:right;
	font-size:11px;
}


/*-------------------- main --------------------*/
#main {
	clear:both;
	float:right;
	margin-top:40px;
	margin-bottom:100px;
	width:670px;
}
#pankuzu {
	margin-left:10px;
	margin-bottom:34px;
}
.inside {
	margin-left:20px;
	width:650px;
}
#newsinside {
	margin-left:20px;
	width:650px;
	padding-bottom:20px;
}
#newsinside a{
	color:#5e5e5e;
}
#newsinside a:hover{
	color:#d5d5d5;
}
/*-------------------- TOP --------------------*/
.news h2 {
	background: url(img/headline_news.gif) no-repeat;
}
#ocac_banner h2{
	margin-left:-13px;
	background: url(img/headline_company.gif) no-repeat;
}
h2.user{
	margin-left:13px;
	background: url(img/headline_user.gif) no-repeat;
	width: 657px;
	height: 27px;
}

.topics h2 {
	background: url(img/headline_topics.gif) no-repeat;
}
.title h2 {
	margin-top:20px;
	background: url(img/headline_title.gif) no-repeat;
}
#ocac_banner{
	margin:0 0 20px 20px;
}
.ocac_banner2017,.stage_banner{
	float:left;
	width:325px;
}
.topics_switch_banner{
	width:425px;
	float:left;
	text-align:center;
}
.topics_vita_banner{
	width:218px;
	float:left;
	margin-left:7px;
	text-align:center;
}
.topics_VoiceActorRacingTeam_banner{
	width:218px;
	float:left;
	margin-left:7px;
	text-align:center;
}
.topics_vita_text{
	float:left;
	width: 232px;
	text-align: center;
	margin: 0 0.5em;
}
.topics_vita_text p{
	font-size: 13px;
	font-weight: bold;
}
.topics h5,.title h5 {
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	margin-top: 5px;
	font-size: 16px;
	height: 40px;
	background-color: #E7E2E2;
	box-shadow: inset 15px 15px 90px -20px #FCFCFC, inset -15px -5px 80px -10px #BEB5B5;
	color: #000;
}
.title #mystiage h5 {
	font-size: 14px;
}
.topics h5 img,.title h5 img {
	padding-right:5px;
	padding-left: 1px;
	vertical-align:middle;
}
.topics .colx .box,.title .colx .box {
	width: 206px;
	margin-right: 16px;
}
.topics .colx .box:last-child,.title .colx .box:last-child {
	margin-right: 0;
}
.topics .type {
	margin: 10px 0 6px;
}
.topics #adv .type ,
.topics #appli .type {
	margin-top: 3px;
}
.title h3#LoveSLG_area {
	float:left;
	width:428px;
	margin-right:16px;
}
.title h3#Anime_area {
	float:left;
	width:206px;
}
.topics #anime_block_a h4 ,
.topics #anime_block_b h4 ,
.topics #anime_block_c h4 ,
.topics #anime_block_d h4 ,
.topics #anime_block_e h4 ,
.topics #anime_block_f h4 {
	font-size: 14px;
}
.topics .caption,.topics .topics {
	margin-top: 2px;
	line-height:1.2em;
}


/*-- ADVゲーム --*/
.topics #adv p:last-child {
	margin: 15px 0 0 0;
	font-size: 11px;
}

.topics #adv #sumiko p:last-child {
	margin: 0px 0 0 0;
	font-size: 11px;
}

/*-- アニメ --*/
.topics #anime {
	margin-right: 25px;
	width: 200px;
}
.topics #anime h4+p {
	margin: 2px 0 6px;
	display: block;
}
.topics #anime p+img {
	margin-bottom: 5px;
}

/*-- アプリ --*/
.topics #appli {
	width: auto;
}
.topics #appli h4+p {
	margin: 2px 0 6px;
	display: block;
}
.topics #appli .box {
	margin-right: 25px;
	width: 200px;
}
.topics #appli .box:last-child {
	margin-right: 0;
}
.topics #appli p+img {
	margin-bottom: 5px;
}


/*-- ソーシャルゲーム --*/
.topics #game .box {
	margin-right: 25px;
	width: 200px;
}
.topics #game .box:last-child {
	margin-right: 0;
}
.illust{
	width:440px;
	float:left;
	margin-right:35px;
}
.efect{
	float:left;
	width:175px;
}
.topics #game h3+p{
	margin-bottom: 15px;
}

/*-- ソーシャルゲームメーカーロゴ --*/

.grafic P img.dwango{
	padding-bottom:5px;
}
.grafic P img.squareenix{
	padding-bottom:7px;
}
.grafic P img.gree{
	padding-bottom:7px;
}
.grafic P img.cygames{
	padding-bottom:3px;
}
.grafic P img.crooz{
	padding-bottom:5px;
	margin:0 2px;
}
.grafic P img.koro{
	padding-bottom:4px;
}
.grafic P img.taito{
	padding-bottom:3px;
}




/*-- FLASHアニメ --*/
#topics_3 {
	clear:both;
	margin-bottom:50px;
}
#topics_3 h3 {
	margin-bottom: 10px;
}
#topics_3_left {
	float:left;
	width:133px;
}
#topics_3_right {
	float:right;
}


/*-------------------- 事業内容 --------------------*/
.works h2 {
	background: url(img/headline_works.gif) no-repeat;
}
.works #inside div {
	overflow:hidden;
}
.works #inside div.box {
	margin-right: 16px;
	float:left;
}
.works #inside #first_area {
	border-bottom: 1px #b5b5b5 dotted;  
	margin-bottom: 40px;
}
.works_left {
	float:left;
	margin-bottom:40px;
}
.works_right {
	float:right;
	margin-bottom:40px;
}
.works img.under {
  opacity: 0.55;
}
.works img.under:hover {
  opacity: 0.3;
}
.works h4 {
	margin-bottom: 1em;
	padding: 2px 0 0 7px;
	line-height: 1em;
	color: #535353;
	border-left: 2px #F79710 solid;
}
.works_list1 h4 {
	padding: 0 0 5px;
	border-left: none;
}
.works_list2 h4 {
	border-left: none;
}
.works dt {
	color:#f79710;
}
.moegaku{
    margin-top: 40px;
}
.moegaku h3 {
    margin-bottom: 50px;
}


/*-------------------- FLASHアニメ --------------------*/
.works_list {
	clear:both;
	margin-top:50px;
	overflow:hidden;
	zoom:1;
}
.works_list:first-child {
	margin-top:0;
}
.works_list1 {
	float: left;
	width: 180px;
	margin-right: 55px;
}
.works_list .works_list1:last-child {
	margin: 0;
}
.works_list1 img {
	margin: 0;
	padding: 0;
}
.works_list1 .copy {
	display: block;
	height: 40px;
	font-size: 10px;
	line-height: 10px;
	color: #aaa;
}
.works_list1 h4 {
	padding-bottom:5px;
	margin-bottom:7px;
	border-bottom:1px #535353 dotted;
	line-height:18px;
	color:#f79710;
	font-weight:bold;
}
.margin-bottom30 {
	margin-bottom: 30px;
}
.flash_player {
	margin-left: auto;
	margin-right: auto;
	width: 507px;
}


/*-------------------- きせかえデザイン --------------------*/
.works h3+h4 {
	margin-top: 30px;
}
.works #live>p {
	margin-bottom: 15px;
}
.works #live .box {
	width: 114px;
}
.works #live .box h5 {
	margin: 10px 0;
	font-size: 11px;
	font-weight: bold;
	line-height: 1em;
}
.works #live .box p {
	font-size: 11px;
	line-height: 1.4em;
}

.kisekae_list {
	float:left;
	margin-right:25px;
}
.line_end {
	margin-right:0px;
}

/*-------------------- LINEスタンプ --------------------*/
.works #linestamp>p {
	margin-bottom: 15px;
}
.works #linestamp .box {
	width: 114px;
}
.works #linestamp .box h5 {
	margin: 10px 0;
	font-size: 11px;
	font-weight: bold;
	line-height: 1em;
}
.works #linestamp .box p {
	font-size: 11px;
	line-height: 1.4em;
}
.half_box {
	float: left;
	min-width: 270px;
	margin-bottom: 40px;
}

/*-------------------- LINE着せかえ --------------------*/
.works #line_kisekae .box {
	width: 114px;
}
.works #line_kisekae .box h5 {
	margin: 10px 0;
	font-size: 11px;
	font-weight: bold;
	line-height: 1em;
}
.works #line_kisekae .box p {
	font-size: 11px;
	line-height: 1.4em;
}
div.textline {
	margin-top: 32px;
}

/*-------------------- デコメ・マチキャラ --------------------*/
.decomail_list {
	float:left;
	margin:0 20px 20px 0;
}



/*-------------------- ソーシャルゲーム --------------------*/
.gamesocial h3+.section {
	margin-top:40px;
}
.gamesocial .box {
	width: 206px;
}
.gamesocial h4 {
	margin-bottom:0;
	padding: 0;
	line-height: 1em;
	color: #535353;
	border:none;
	/* border-left: 2px #F79710 solid; */
}
.gamesocial h5 {
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	margin-top: 5px;
	font-size: 16px;
	height: 40px;
	background-color: #E7E2E2;
	box-shadow: inset 15px 15px 90px -20px #FCFCFC, inset -15px -5px 80px -10px #BEB5B5;
	color: #000;
}
.gamesocial h5 img {
	padding-right: 5px;
	padding-left: 1px;
	vertical-align: middle;
}
.gamesocial .gamesocial_ocac{
	margin-bottom:24px;
}
.gamesocial .type {
	margin: 10px 0 6px;
}
.gamesocial p {
	/* margin-bottom: 1em; */
}
.gamesocial .efect p {
	margin-bottom: 0;
	margin-left:57px;
}
.gamesocial .unit img {
	margin:0 0 20px 0;
}
.efect img {
	margin:0 0 0 0;
}


/*-------------------- スマートフォンアプリ --------------------*/
.smart {
	margin-bottom:40px;
}
.smart .charavoice,.smart .shizuku {
	width:330px;
	margin-right:5px;
	float:left;
}
.smart h3+p {
	margin-bottom:40px;
}
.smart p {
	margin-bottom: 1em;
}
.smart p:last-child {
	margin-bottom: 0;
}

.smart .col2_ab .box:nth-of-type(1) {
     width: 200px;
}
.smart .col2_ab .box:nth-of-type(1) p {
     margin-top: 2px;
     line-height: 1.2em;
}

.smart h4 {
	padding: 2px 0 0 7px;
	line-height: 1em;
	color: #535353;
	border-left: 2px #F79710 solid;
}
.smart h5 {
	float: left;
	margin: 0 0 20px 0;
}
.smart .type span {
	float: left;
	margin-top: 1px;
}
.smart .type span:first-child {
	margin-left: 10px;
}
.smart .type+p {
	clear: both;
}
.smart h6 {
	margin: 20px 0 8px 0;
	border-left: 10px solid #F79710;
	padding-left: 3px;
	font-size: 10px;
	font-weight: normal;
	line-height: 1em;
	color: #ccc;
}
.smart iframe {
	float: left;
	margin: 0 4px 5px 0;
}
.smart iframe:last-child {
	margin: 0;
}


/*-------------------- モバイルサイト --------------------*/
.mobile h3 + p {
 margin-bottom: 40px;
}
.works_list2 {
	display: block;
	clear: both;
	width: 650px;
	margin-bottom: 50px;
}
.section .works_list2:last-child {
	margin-bottom: 0;
}
.works_list2 img {
	margin: 0;
	padding: 0;
}
.works_list2 .copy {
	display: block;
	font-size: 10px;
	line-height: 10px;
	color: #aaa;
}
.works_list2 h4 {
	padding:5px 0 3px 0;
	margin-bottom:10px;
	border-bottom:1px #535353 dotted;
	line-height:18px;
	height: 20px;
	font-weight: normal;
	font-size: 12px;
}
.works_list2 .wtitle {
	float: left;
	color:#f79710;
	font-weight:bold;
	font-size: 13px;
}
.works_list2 .career {
	float: right;
	margin-right: 5px;
	color: #666;
	width: 20px;
	height: 20px;
	text-indent: -9999px;
}
.works_list2 .imode {
	background: url(img/icon_imode.gif) 0 0 no-repeat;
}
.works_list2 .ez {
	background: url(img/icon_ez.gif) 0 0 no-repeat;
}
.works_list2 .yahoo {
	background: url(img/icon_yahoo.gif) 0 0 no-repeat;
}
.works_list2 .career_gree {
	float: right;
	margin-top:4px;
	margin-right: 5px;
	color: #666;
	width: 54px;
	height: 14px;
	text-indent: -9999px;
}
.works_list2 .gree {
	background: url(img/icon_gree.gif) 0 0 no-repeat;
}
.works_list2 .dekome {
	background: #81c322;
}
.works_list2 .kisekae {
	background: #d27dda;
}
.works_list2 .anime {
	background: #3fa4d9;
}
.works_list2 .idol {
	background: #ff9141;
}
.works_list2 .game {
	background: #fb7695;
}
.works_list2 .flash {
	background: #ffaf25;
}
.works_list2 .dekomail {
	background: #30bfb1;
}
.works_list2 .emoji {
	background: #d9d921;
}
.works_list2 .uranai {
	background: #ff6666;
}
.works_list2 .genre {
	float: right;
	margin:0 0 0 5px;
	padding:2px 0 0 1px;
	width:100px;
	height:13px;
	text-align:center;
	font-size:10px;
	font-weight:bold;
	line-height:1em;
	color: #fff;
	-webkit-border-radius: 8px;   /* Safari,Google Chrome用 */
	-moz-border-radius: 8px;   /* Firefox用 */
	border-radius: 8px;   /* CSS3草案 */
	behavior: url(http://www.operahouse.co.jp/wp-content/themes/operahouse/PIE.htc);
}
.works_list2 .left {
	display: block;
	clear: both;
	width: 191px;
	float: left;
	margin-right: 20px;
}
.works_list2 .qr {
	position:relative;
	left:-8px;
	margin-top:12px;
}
.works_list2 .qr img {
	float:left;
}
.works_list2 .qr p {
	position:relative;
	top:8px;
	left:11px;
	margin-right:3px;
	font-size:11px;
	line-height:1.4em;
}
.works_list2 .right {
	display: block;
	float: left;
	width:439px;
}
.works_list2 .right p:first-child {
	margin-top:0;
}
.works_list2 .accesse {
	clear: both;
	padding: 1px 4px;
	display: block;
	border: 1px solid #dedede;
	margin-top: 6px;
}
.works_list2 .career_icon {
	width: 45px;
	height: 20px;
	background: url(img/access.gif) 50% 50% no-repeat;
	margin-right: 10px;
	text-align: center;
	font-size: 10px;
	line-height: 20px;
	display: block;
	float: left;
}
.works_list2 .info {
	display: block;
	border-left: 10px solid #f79710;
	padding-left: 3px;
	height: 10px;
	font-size: 10px;
	line-height: 10px;
	color: #aaa;
	margin-top: 20px;
	margin-bottom: 4px;
}
.works_list2 .docomoid {
	margin-top:15px;
}
.works_list2 .nomargin {
	margin-top:0;
}
.mobile .other h4 {
	padding: 0;
	font-size: 16px;
	font-weight: bold;
	border-left: none;
}
.mobile .other p {
	font-size: 11px;
	line-height:1.4em;
}


/*-------------------- HPデザイン --------------------*/


/*-------------------- 権利作品 --------------------*/
.kenri .section {
	margin-bottom: 100px;
}
.kenri .section:last-child {
	margin-bottom: 0;
}
.kenri h3+p {
	margin-bottom:40px;
}
.kenri h3+.section {
	margin-top: 40px;
}
.kenri h4 {
	padding: 2px 0 0 7px;
	line-height: 1em;
	color: #535353;
	border-left: 2px #F79710 solid;
}

/*-- game --*/
.kenri .game h4+p {
	margin-bottom:20px;
}
.kenri .game .colx>.box {
	margin-right: 30px;
}
.kenri .game .colx>.box:last-child {
	margin-right: 0;
}

.kenri .game .type {
	margin: 10px 0 6px;
}

.kenri .game a:link,.kenri .game a:visited {
	color: #f25757;
} 
.kenri .game a:hover {
	color: #d5d5d5;
} 
.kenri .game .clear {
	margin: 15px 0 0 0;
	font-size: 11px;
} 
.kenri .inbox {
	margin-bottom:30px;
}
/*-- moegaku --*/
.kenri .moegaku .read {
	margin-bottom: 40px;
}
#kenri_left {
	float:left;
	width:243px;
}
#kenri_left p {
	font-size:11px;
	color:#b5b5b5;
	line-height:1.1em;
}
.kenri_1 {
	float:left;
	margin-left:0px;
}
.kenri_2 {
	float:left;
	margin-top:50px;
	margin-left:13px;
}
.kenri_2_p {
	float:right;
	margin-right:8px;
}
.kenri_3 {
	clear:both;
	margin-top:30px;
}
.kenri_4 {
	margin-top:30px;
}
#kenri_right {
	float:right;
	width:360px;
}
.kenri_5 {
	float:right;
}
#kenri_right p {
	float:right;
	font-weight:bold;
}
.kenri_6 {
	/* margin-top:40px; */
	margin-bottom:10px;
	float:right;
}
.kenri_7 {
	float:right;
}


/*-------------------- デザイナー画廊 --------------------*/
.designer h3+p {
	margin-bottom:40px;
}
.designer p {
	margin-bottom: 0.8em;
}

.designer_prof {
	margin-bottom:30px;
}
.designer_prof h4 {
	margin: 0 0 5px 0;
	padding: 0;
	color: #F79710;
	border-left: none;
}
.designer_info {
	margin-bottom:30px;
	font-size: 11px;
	line-height: 1.4em;
}
.designer_list a img {
	margin-bottom: 20px;
}
.designer_list a:last-child img {
	margin-bottom: 0;
}
.works .sample {
	margin:20px 0 0 0;
}
.works .sample img {
	margin-top:30px;
}
.works .sample .samplebtn {
	margin-top:20px;
}


/*-------------------- 会社概要 --------------------*/
.company h2 {
	background: url(img/headline_company.gif) no-repeat;
}
/*-------------------- プライバシーポリシー --------------------*/
.privacypolicy h2 {
	background: url(img/headline_privacypolicy.gif) no-repeat;
}
.privacypolicy h4 {
	font-size: 15px;
	margin: 20px 0 5px;
}
.privacypolicy h5 {
	font-size: 13px;
	margin: 10px 0 1px 1em;
}
ul.privacypolicylist ul {
	margin-left:1em;
}
ul.privacypolicylist ul ul {
	margin-left:1em;
}
ul.privacypolicylist p {
	margin-left:1em;
}
ul.privacypolicylist div.cap {
	margin-top:5px;
} 
ul.privacypolicylist div.cap ul {
	margin-left:2em;
} 
.privacypolicy h5 + ul,.privacypolicy h5 + p{
	margin-left:2em;
}
/*-------------------- 特定商取引法に基づく表示 --------------------*/
.sct h2 {
	background: url(img/headline_sct.gif) no-repeat;
}
.sct h4 {
	font-size: 15px;
	margin: 20px 0 5px;
}
.sct ul p {
	margin-left:1em;
}
/*-------------------- 資金決済法に基づく表示 --------------------*/
.settlement h2 {
	background: url(img/headline_settlement.gif) no-repeat;
}
.settlement h4 {
	font-size: 15px;
	margin: 20px 0 5px;
}
.settlement ul p {
	margin-left:1em;
}
.settlement ul ul {
	margin-left:1em;
}

/*-------------------- 利用規約（乙女ゲーム） --------------------*/
.userpolicy_otome h2 {
	background: url(img/headline_userpolicy_otome.gif) no-repeat;
}
.userpolicy_otome h4 {
	font-size: 15px;
	margin: 20px 0 5px;
}
.userpolicy_otome ul p {
	margin-left:1em;
}
.userpolicy_otome ul ul {
	margin-left:2em;
}
/*-------------------- 配信ガイドライン --------------------*/
.guideline h2 {
	background: url(img/headline_guideline.gif) no-repeat;
}
.guideline h3 {
	margin: 20px 0 5px;
}
.guideline h4 {
	font-size: 20px;
	margin: 20px 0 5px;
}
.guideline h5 {
	font-size: 13px;
	margin: 10px 0 1px 1em;
}
ul.guidelinelist ul {
	margin-left:1em;
}
ul.guidelinelist ul ul {
	margin-left:1em;
}
ul.guidelinelist p {
	margin-left:1em;
}
ul.guidelinelist div.cap {
	margin-top:5px;
} 
ul.guidelinelist div.cap ul {
	margin-left:2em;
} 
.guideline h5 + ul,.guideline h5 + p{
	margin-left:2em;
}
.space_2{
	margin-bottom: 20px;
}
.attention-in li {
    margin-bottom: 20px;
    text-indent: -1em;
    margin-left: 1em;
}
/*-------------------- 地図 --------------------*/
.map h2 {
	background: url(img/headline_map.gif) no-repeat;
}
.map th {
	width:280px;
	padding:0px;
	background:none;
	text-align:left;
	border:none;
}
.map td {
	padding:0px;
}
.map_link {
	padding-top:30px;
}
.map p a {
	font-size: 11px;
}
.map .map_tabs{
	height:40px;
	margin-left:21px;
	padding-bottom: 2px;
	overflow: hidden;
}
.map .tabs_check{
	background-color: #ffffcc;
	font-size: 15px;
	line-height: 40px;
	height: 40px;
	position: relative;
	padding: 0 20px;
	float: left;
	display: block;
	width: 80px;
	color: #385c5b;
	letter-spacing: 1px;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.3);
	border:1px solid #ff6600;
}
.map .tabs{
	background-color: #ffcc33;
	font-size: 15px;
	line-height: 40px;
	height: 40px;
	position: relative;
	padding: 0 20px;
	float: left;
	display: block;
	width: 80px;
	color: #385c5b;
	letter-spacing: 1px;
	font-weight: bold;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.3);
	border-top:1px solid #ff6600;
	border-right:1px solid #ff6600;
	border-left:1px solid #ff6600;
	border-bottom:1px solid #ff6600;
}
.map_tabs a + .tabs_check{
	border-right:1px solid #ff6600;
	border-left:none;
}

.map_tabs a:hover{
	opacity:0.7;
}
.map #inside{
	margin-left: 21px;
	padding-top:20px;
	overflow:hidden;
}

/*-------------------- 地図_詳細 --------------------*/
.step {
	float:left;
	margin-right:30px;
	width:181px;
}
.step img {
	margin-top:25px;
	margin-bottom:5px;
}
.step p {
	line-height:1.5em;
}
.step.meeting {

}
.step.meeting h5{
	font-size: 14px;
	color: #FF6300;
	/*border-bottom: 1px #535353 dotted;*/
}

/*-------------------- 求人情報 --------------------*/
.recruit h2 {
	background: url(img/headline_recruit.gif) no-repeat;
}
.recruit h4 {
	margin-bottom:4px;
}
.recruit table td ul {
	margin-left: 1.0em;
}
.recruit table td ul li {
	margin-bottom:1em;
	text-indent: -1.0em;
}

/*-------------------- お問合せ --------------------*/
.contact h2 {
	background: url(img/headline_contact.gif) no-repeat;
}
.contact dt {
	color:#ea67a8;
}
.contact #contact_gameuser,.contact #contact_business{
	float:left;
}

.contact #contact_gameuser a {
	display: block;
	width: 250px;
  	background-color: #ff9d05;
	text-shadow: 0 -1px 0px #ffa71e, 0 1px 0px #bf7400;
	color: #FFFFFF;
	text-align: center;
	margin: 15px auto 0;
	padding: 30px 15px;
	font-weight: bold;
	font-size: 20px;
	margin: 30px 20px;
	transition: opacity 0.6s;
}
.contact #contact_business a {
	display: block;
	width: 250px;
	background-color: #44adf7;
	text-shadow: 0 -1px 0px #1486d6, 0 1px 0px #2771a5;
	color: #FFFFFF;
	text-align: center;
	margin: 15px auto 0;
	padding: 30px 15px;
	font-weight: bold;
	font-size: 20px;
	margin: 30px 20px;
	transition: opacity 0.6s;
}
.contact #contact_gameuser a:hover,.contact #contact_business a:hover {
	opacity: 0.6;
	transition: opacity 0.6s;
	text-decoration: none;
}

/*-------------------- STAGE SWITCH --------------------*/
#stage p,#stage h2 {
    font-family: -apple-system, blinkMacSystemFont, /* Macの欧文はSan Francisco (OS X 10.11以降) */ 'Helvetica Neue', /* Macの欧文 (OS X 10.10以前) */ 'Segoe UI', /* Windowsの欧文 */ 'Hiragino Kaku Gothic ProN', /* Macのヒラギノ */ Meiryo, /* Windowsのメイリオ */ sans-serif;
}

#stage h2 {
	text-indent: inherit;
	width: auto;
	height: auto;
	text-align: center;
	margin: 1em;
	font-size: 24px;
	font-weight: bold;
}
#stage h2.oomidashi{
	font-size: 32px;
	line-height: 1.4;
	color: #49dcf2;
	position: relative;
	padding: 0.25em 1em;
	border-top: solid 2px #3e0000;
	border-bottom: solid 2px #3e0000;
}#stage h2.oomidashi span{
	font-size: 28px;
	color: #3e0000;
}
#stage h2.oomidashi:before, #stage h2.oomidashi:after{
	content: '';
	position: absolute;
	top: -7px;
	width: 2px;
	height: -webkit-calc(100% + 14px);
	height: calc(100% + 14px);
	background-color: #3e0000;
}
#stage h2.oomidashi:before {left: 7px;}
#stage h2.oomidashi:after {right: 7px;}
#stage p {
	text-indent: 1em;
	font-size: 16px;
	line-height: 1.8;
}
#stage p strong {
	font-weight: bold;
	color: #ffdc26;
	font-size: 117%;
	margin: 0 2px;
}
#stage p strong.uni {
	color: #18ff2f;
	font-size: 120%;
}
#stage p strong.switch {
	color: #e60012;
	text-shadow: none;
}
#stage p.pressdate {
	text-indent: 0;
	font-size: 24px;
}

#stage h3 {
	border: none;
	text-align: center;
	margin-top: 1.5em;
}
.basicprice {
	margin: 0 auto 1em;
	width: 365px;
}
.basicprice h4 {
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 0.5em;
	text-decoration: underline;
}
#stage ul li{
	font-size: 16px;
	line-height: 1.8;
}
#stage p.noindent{
	text-indent: 0;
}


#stage a:hover {
	opacity: 0.6;
	transition: opacity 0.6s;
	text-decoration: none;
}
.stage-contact a{
	display: block;
	width:18em;
	background-color: #44adf7;
	text-shadow: 0 -1px 0px #1486d6, 0 1px 0px #2771a5;
	color: #FFFFFF;
	text-align: center;
	margin: 15px auto 0;
	padding: 30px 15px;
	font-weight: bold;
	font-size: 20px;
	transition: opacity 0.6s;
}
#stage .oshirase{
	background: url(img/unity-bg220.jpg) no-repeat;
	height: 255px;
	background-size: cover;
	padding: 1.2em 1em 1em;
}
#stage .oshirase p{
	text-indent: 1em;
	font-size: 20px;
	line-height: 1.9;
	color: #ffffff;
	text-shadow: #234f8e 0 0 6px;
	background-color: rgba(87, 166, 224, 0.45);
	margin-top: 1em;
	padding: 0 0.8em 1em;
	background: -moz-linear-gradient(top, rgba(87, 166, 224, 0.45), #b2f08b);
	background: -webkit-linear-gradient(top,rgba(87, 166, 224, 0.45), #b2f08b);
	background: linear-gradient(to bottom, rgba(87, 166, 224, 0.45), #b2f08b);
}
#stage .planning{
	background: url(img/unity-bg010.jpg) no-repeat;
	height: 380px;
	background-size: cover;
	padding: 1em;
}
#stage .planning h2{
	color: #fff;
	border-bottom: 2px solid #fff;
	padding-bottom: 10px;
}
#stage .planning p{
	text-indent: 1em;
	font-size: 20px;
	line-height: 1.8;
	color: #ffffff;
	text-shadow: #234f8e 0 0 6px;
	background-color: rgba(87, 166, 224, 0.45);
	margin-top: 1em;
	padding: 0.5em 0.8em 1em;
	background: -moz-linear-gradient(to bottom, rgba(76, 133, 214, 0.4) 0%, #2f92bc 60%,#efea96 100%);
	background: -webkit-linear-gradient(to bottom, rgba(76, 133, 214, 0.4) 0%, #2f92bc 60%,#efea96 100%);
	background: linear-gradient(to bottom, rgba(76, 133, 214, 0.4) 0%, #2f92bc 60%,#efea96 100%);
}
#stage .graphic{
	background: url(img/unity-bg100.jpg) no-repeat;
	height: 350px;
	background-size: cover;
	padding: 1em;
}
#stage .graphic h2{
	color: #fff;
	border-bottom: 2px solid #fff;
	padding-bottom: 10px;
	text-shadow: 1px 0px 3px #156773;
	background-color: #6cbbba6e;
	box-shadow: 5px 0px 6px 9px #6cbbba59;
}
#stage .graphic p{
	text-indent: 1em;
	font-size: 20px;
	line-height: 1.8;
	color: #ffffff;
	text-shadow: #043e2d 1px 0 6px;
	margin-top: 1em;
	padding: 0.5em 0.8em 1em;
	background: -moz-linear-gradient(to bottom, rgba(76, 214, 157, 0.2) 0%, rgba(162, 231, 189, 0.70) 15%,rgba(73, 205, 212, 0.67) 60%,rgba(218, 194, 123, 0.87) 100%);
	background: -webkit-linear-gradient(to bottom, rgba(76, 214, 157, 0.2) 0%, rgba(162, 231, 189, 0.70) 15%,rgba(73, 205, 212, 0.67) 60%,rgba(218, 194, 123, 0.87) 100%);
	background: linear-gradient(to bottom, rgba(76, 214, 157, 0.2) 0%, rgba(162, 231, 189, 0.70) 15%,rgba(73, 205, 212, 0.67) 60%,rgba(218, 194, 123, 0.87) 100%);
}
#stage .world{
	background: url(img/unity-bg080.jpg) no-repeat;
	height: 280px;
	background-size: cover;
	padding: 1em;
}
#stage .world h2{
	color: #fff;
	border-bottom: 2px solid #fff;
	padding-bottom: 10px;
	text-shadow: 1px 0px 3px #0a4c4c;
	background-color: #233d2275;
	box-shadow: 5px 0px 6px 9px #1f341b69;
}
#stage .world p{
	text-indent: 1em;
	font-size: 20px;
	line-height: 1.8;
	color: #ffffff;
	text-shadow: #043e2d 1px 0 6px;
	margin-top: 1em;
	padding: 0.5em 0.8em 1em;
	background: -moz-linear-gradient(to bottom, rgba(253, 253, 253, 0.18) 0%, rgba(29, 46, 22, 0.54) 15%,rgba(28, 144, 150, 0.7) 60%,rgba(115, 127, 81, 0.54) 100%);
	background: -webkit-linear-gradient(to bottom, rgba(253, 253, 253, 0.18) 0%, rgba(29, 46, 22, 0.54) 15%,rgba(28, 144, 150, 0.7) 60%,rgba(115, 127, 81, 0.54) 100%);
	background: linear-gradient(to bottom, rgba(253, 253, 253, 0.18) 0%, rgba(29, 46, 22, 0.54) 15%,rgba(28, 144, 150, 0.7) 60%,rgba(115, 127, 81, 0.54) 100%);
}


/*-------------------- side --------------------*/
#side {
	float:left;
	margin-top:40px;
	margin-bottom:60px;
	width:190px;
}
#side p {
	margin-bottom:0;
	width:170px;
	font-size:11px;
	line-height:12px;
}
#menu {
	clear:both;
}
#menu a {
	margin-top: 13px;
	height: 15px;
	display: block;
}
#menu a.large {
	margin-top: 13px;
	height: 30px;
	display: block;
}
#menu li:first-child a {
	margin-top: 15px;
}
#menu li:last-child a {
	margin-bottom: -2px;
}
#menu .menu_line{
	border-bottom: 1px #b5b5b5 dotted;
	margin-right: 20px;
	padding-bottom:13px;
}



#banner a {
	margin-top:10px;
	display:block;
}
#banner a:first-child {
	margin-top:0;
}
#banner img {
	margin-bottom:2px;
	display:block;
}
#banner .under {
	margin-bottom:-3px;
}
#contact img {
	margin-bottom:-1px;
}
#side hr {
	margin:30px 0;
	width:170px;
	height:1px;
	border:none;
	border-bottom:1px #b5b5b5 dotted;
	text-align:left;
}

/*-- 検索フォーム --*/
#srchForm #srchInput {
	width:130px;
	margin:0px 0;
	padding:0;
}
#srchForm #srchBtn {
	position:relative;
	top:1px;
	width:30px;
	height:20px;
	background:url(img/side_search.gif) no-repeat;
	border:none;
	cursor:pointer;
	text-indent:-9999px;
	margin-left:5px;
	padding:0;
	vertical-align: baseline;
}
#srchLogo a {
	color:#b5b5b5;
}

#twitter {
	width:180px;
	height: 590px;
}
label.screen-reader-text {
    display: none;
}
input#s {
    width: 70%;
    padding: 2px;
    vertical-align: bottom;
}
input#searchsubmit {
    font-size: 12px;
    padding: 1px 3px;
    vertical-align: bottom;
	color: #535353;
}
ul#page_search_list {
    padding-left: 20px;
    margin-top: 20px;
}
ul#page_search_list li {
    list-style: square;
    font-weight: bold;
    font-size: 18px;
    padding: 14px 0;
}


/*-------------------- footer --------------------*/
#footer {
	font-size:10px;
}
#footer img {
	float:right;
	position:relative;
	top:-23px;
	margin:0;
	padding:0;
}
#footer ul {
	margin-top:10px;
}
#footer li {
	list-style-type:none
}
#footer .top {
	float:left;
}
#footer .works {
	float:left;
}
#footer .company {
	float:left;
	margin-left:0px;
}
#footer .map {
	float:left;
}
#footer .recruit {
	float:left;
}
#footer .contact {
	float:left;
}
#footer .verticalline {
	float:left;
	margin-left:38px;
	margin-right:40px;
}
#footer .verticalline_a {
	float:left;
	margin-left:-22px;
	margin-right:40px;
}
.ruledline {
	color:#535353;
}
#footer p {
	clear:both;
	float:right;
	padding-bottom:20px;
	position:relative;
	top:-20px;
}


/*-------------------- footer_bg --------------------*/
#footer_bg {
	clear:both;
	border-top:#535353 2px solid;
}

/*-------------------- リニューアルTeaser2021--------------------*/
/*-------------------- 全体に関する設定 --------------------*/

h2 {
	width: auto;
	height: 27px;
	margin-left:13px;
	margin-bottom:20px;
	text-indent: inherit;
}
h3 , h4 , h5 , h6 {
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,Arial,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
	font-weight:bold;
}
h3 {
	padding-bottom:5px;
	margin-bottom:7px;
	font-size:1.8rem;
	line-height:1.2em;
	color:#535353;
	border-bottom:none;
}
#pankuzu {
	margin-left: 10px;
	margin-bottom: 5px;
	font-size: 1.2rem;
}
.color_works {
	color:#f79710;
}

.cf:before,
.cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}


/*-------------------- home --------------------*/
html{
	font-size: 62.5%;
}
body {
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro','メイリオ', 'Meiryo', '游ゴシック', 'Yu Gothic', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	color:#535353;
	positon:relative;
	word-break: break-all;
	font-size: 1.6rem;
	line-height:1.8;
}
h1 {
    font-size: 36px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2.4rem + ((1vw - 0.64rem) * 2.1429));/* 24px~36pxで可変*/
    line-height: 1.3;
}
h2 {
    font-size: 24px;/* IE8以下とAndroid4.3以下用フォールバック */
    font-size: calc(2rem + ((1vw - 0.64rem) * 0.7143));/* 20px~24pxで可変*/
    line-height: 1.3;
}
.smooth {
	clip-path: inset(0 100% 0 0);
	display: inline-block;
	font-size: 36px;
	font-weight: bold;
	transition: 0.3s cubic-bezier(0.37, 0, 0.63, 1);
	transition-property: clip-path;
	line-height: 1;
	height: 40px;
	margin-top: 15px;
}
#titleanime .smooth {
	height: 80px;
}
.smooth.is-animated {
	clip-path: inset(0);
}
.fadeIn {
	transform: translate3d(0, -10px, 0);
	transition: 1s;
  opacity: 0;
}
.fadeIn.is-animated {
  transform: translate3d(0, 0, 0);
  opacity: 1;
}
#header {
    padding-bottom: 0px;
    margin-bottom: 1em;
	height: auto;
    position: relative;
}
#topics h2{
	color: #ff57bb;
}
#pickup h2{
	color: #0bcd00;
}
#titlelist h2,#titleanime h2{
	color: #ee3f3e;
}
#sns h2{
	color: #00acee;
}
#works h2{
	color: #f79710;
	margin-left: 0;
}
#topics {
    background-color: #FFDEE9;
    background-image: linear-gradient( 336deg, #FFDEE9 0%, #B5FFFC 100%);
	padding: 0.5em 0;
	position: relative;
}
article.topicsshell {
    max-width: 100vw;
    margin-left: auto;
    margin-right: auto;
    background-color: rgb(255 255 255 / 30%);
	border-radius: 20px;
}
#headline{
	margin-top: 2em;
	padding-bottom: 2em;
	background:url(img/pickupBG2.jpg) no-repeat;
	background-size: cover;
}
#pickup{
	margin-top: 2em;
	padding-bottom: 2em;
	background:url(img/pickupBG2.jpg) no-repeat;
	background-size: cover;
}
#titlelist{
	margin-top: 2em;
	padding-bottom: 2em;
	background:url(img/titlegameBG2.jpg) no-repeat;
	background-size: cover;
}
#titleanime{
	margin-top: 2em;
	padding-bottom: 2em;
	background:url(img/titleanimeBG.jpg) no-repeat;
	background-size: cover;
}
.headlineinner,.pickupinner,.titlelistinner,.titleanimeinner {
    max-width: 100vw;
    margin-left: auto;
    margin-right: auto;
    background-color: rgb(255 255 255 / 30%);
    border-radius: 20px;
}
.youtube {
    width: 100%;
}
.youtube div{
    width: 100%;
    aspect-ratio: 16 / 9;
}
.youtube iframe {
    width: 100%;
    height: 100%;
}
#titlelist ul li .box h5 img{
    padding-right: 2px;
}
#works{
	margin-top: 2em;
	margin-left: 5px;
	margin-right: 5px;
}
.swiper-containertop {
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
}
.swiper-slide{
	margin-right: 1em;
}
.swiper-containertop .swiper-slide img{
	width: 100%;
	}
.swiper-slide[class*=-prev],.swiper-slide[class*=-next] {
	opacity: 0.2;
	}
.swiper-button-prev,.swiper-button-next {
	opacity: 0;
	transition: opacity 1.0s;
	color: #50bfde;
}
#topics:hover .swiper-button-prev,#topics:hover .swiper-button-next {
	transition: opacity 1.5s;
	opacity: 1;
	color: #50bfde;
	}
.swiper-pagination-bullet-active {
    background-color: #50bfde;
}
.center {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}
#logo {
    margin: 14px 0 0 0;
    text-align: center;
}
#logo img,
.catch img {
	width: 100%;
	height: auto;
	display: block;
	margin: auto;
}
#topimg {
    padding: 16px 26px 26px 16px;
    width: 100vw;
    box-sizing: border-box;
    margin: 0 auto;
}
#topimg img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 10px 10px #ede7ee;
    border: 1px #b6b5b7 solid;
}
.catch,
.renewtext {
    background-color: #FFDEE9;
    background-image: linear-gradient(336deg, #FFDEE9 0%, #B5FFFC 100%);
    margin: 0 auto;
    padding: 0 1em;
    text-align: center;
    color: #69b1db;
    height: 50vw;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}
.renewtext h1 {
	font-size: 130%;
	font-weight: bold;
	line-height: 1.4em;
	text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff;
}
.post_thumbnail {
	width: 100%;
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto;
}
.post_thumbnail img{
	width: 100%;
	height: 100%;
	max-height: 150px;
	object-fit: contain;
}
.box, .box img{
	width:100%;
}
.pickupover {
	grid-column: span 2;
}
.pickupovertext {
    padding-left: 5px;
    margin-bottom: 4em;
}
.pickupovertext .type {
	height: 33px;
	line-height: 33px;
}
.type span{
	background: #a6a5a5;
}
.pickupovertext .type span{
	font-size: 2rem;
}
#pickup .pickupovertext h3{
	font-size: 3rem;
	min-height: 1em;
	line-height: 1.6;
}
.pickupovertext .link {
	line-height: 1;
	font-size: 2.4rem;
	height: 1.4em;
}
#pickup .pickupovertext h5{
	font-size: 1.4rem;
}
.pickupunder {
}
.pickupunder .box{
}
#topics h3,#headline h3,#pickup h3,#titlelist h3,#titleanime h3{
	border-bottom: none;
}
#topics h3{
	padding: 0 0.5em;
	text-align: left;
}
.time {
	font-size: 1rem;
	text-align: left;
	margin-left: 9px;
}
#headline ul,#pickup ul{
	display:grid; 
	grid-template-columns: 50% 50% ;
	justify-content: space-between;
}
#titlelist ul ,#titleanime ul {
	display:grid; 
	grid-template-columns: 50% 50%;
}
#pickup li.pickupover{
	margin: 0 5px 0;
}
#headline li.headlineunder,#pickup li.pickupunder,#titlelist li,#titleanime li{
	margin: 0 5px 4em;
}
.pickupunder ul li img,#titlelist ul li img,#titleanime ul li img{
	width:100%;
	height:auto;
}
#headline h3,#pickup h3,#titlelist h3,#titleanime h3{
	font-size: 1.6rem;
	padding-bottom: 0;
}
#headline h3.small,#pickup h3.small,#titlelist h3.small,#titleanime h3.small{
}
#headline h5,#pickup h5, #titlelist h5, #titleanime h5 {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    margin-top: 5px;
    font-size: 1.3rem;
    font-weight: normal;
    height: 50px;
    color: #000;
}
#headline h5 img,#pickup h5 img, #titlelist ul li h5 img, #titleanime ul li h5 img{
	width:40px;
    height: 40px;
	vertical-align: middle;
}
.banner-otome6 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 2.0rem;
}
.banner-otome6 a span{
    color: #f4b2b1;
}
.banner-otome6 img{
    width: 75%;
	border: 2px solid #f4b2b1;
}
.titleimg {
    line-height: 1;
}
.type {
    height: 20px;
    line-height: 10px;
    margin: 5px 0;
}
.link {
	line-height: 1.4;
	font-size: 1.5rem;
	height: 1.4em;
}
.link .small {
    font-size: 1.0rem;
}
.link a {
	color: #ee3f3e;
}
#twitter {
    height: 300px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    border-top: 2px solid #00acee;
    border-bottom: 2px solid #00acee;
}
#works div{
	text-align:center;
}
.oh-works,.oh-works-down{
	display:block; 
}
.oh-works-down{
	border-bottom: 1px dotted #bfbfbf;
    padding-bottom: 2em;
    margin-bottom: 2em;
}
.oh-works li,.oh-works-down li{
	margin: 0.5em 2em;
}
.oh-works li a img,.oh-works-down li a img{
	width:299px;
}
.topics_switch_banner {
	width: 100%;
	float: inherit;
	text-align: center;
}
.topics_switch_banner img{
	width: 100%;
	margin-top: 1em;
}
.link_banner > div{
	margin-top: 1em;
}
.link_banner div{
	text-align: center;
	width:100%;
	margin-left: auto;
	margin-right: auto;
}
#contact,#primary-sidebar{
	text-align: center;
}
.another-area {
	margin: 1em 0;
	border-top: 1px dotted #bfbfbf;
	margin-top: 2em;
	padding-top: 2em;
}
#contact {
	margin-left: auto;
	margin-right: auto;
}
.contact-btn {
	margin-left: auto;
	margin-right: auto;
	font-weight: bold;
	border: 2px solid #000;
	width: 170px;
	display: block;
}
#primary-sidebar {
    margin-top: 1em;
}
#primary-sidebar div p{
	padding-bottom:5px;
	margin-bottom:7px;
	font-size:1.8rem;
	font-weight: bold;
	line-height:1.2em;
	color:#535353;
	border-bottom:none;
}
form#searchform {
	line-height: 1;
}
#works #term {
	width: 14em;
	margin-top:4em;
	margin-left: auto;
	margin-right: auto;
	margin-bottom:2em;
	text-align: left;
}
#term i {
	color: #8fd449;
	margin-right: 0.2em;
}
#footer {
    font-size: 1.4rem;
}
#footer ul {
    margin-top: 10px;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
#footer .top,
#footer .verticalline,
#footer .company,
#footer .contact {
	float: none;
	white-space: nowrap;
}
#footer p {
    clear: both;
    float: inherit;
    padding-bottom: 20px;
    position: relative;
    top: 1em;
    text-align: center;
    font-size: 1rem;
}
#footer .verticalline {
    float: left;
    margin-left: 30px;
    margin-right: 32px;
}
#footer img {
	top: -13px;
	mix-blend-mode: multiply;
}
      .swiper {
        width: 100%;
        height: 100%;
        margin-left: auto;
        margin-right: auto;
		padding-bottom: 2em;
}

      .swiper-slide {
        text-align: center;
        font-size: 18px;
        height: calc((100% - 30px) / 2);

        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }
.pch2{
		display:none;
}

	
/*-------------------- 会社概要 --------------------*/
.company {
    margin: 0 5px 0;
}
.company h2 {
    background: url(img/headline_company-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
#main {
    clear: both;
    float: inherit;
    margin-top: 40px;
    margin-bottom: 100px;
    width: 100vw;
}
table {
    margin-left: auto;
    margin-right: auto;
    width: 94%;
    border-spacing: 0px;
    font: 12px "ＭＳ Ｐゴシック",arial,helvetica,clean,sans-serif;
    color: #535353;
    *: ;
    font-size: small;
    *: ;
    font: x-small;
    line-height: 1.6em;
    positon: relative;
}
th {
    width: 100px;
    padding: 13px 0px 13px 0px;
    background: url(https://www.operahouse.co.jp/wp-content/themes/operahouse/img/pattern.gif);
    text-align: center;
    vertical-align: middle;
    font-weight: normal;
    border-bottom: 2px #ffffff solid;
}

/*-------------------- Topics --------------------*/
.topics h2{
	margin-left: 10px;
	color: #ff57bb;
	background: none;
	font-size: 36px;
	height: 40px;
}
.topics picture img {
	width: 100%;
	height: auto;
}
.topics img {
	width: 100%;
	height: auto;
}
.topics #inside {
	padding: 0 10px;
}
.topics #inside a{
	color:#1558d6;
}
.topics .post-title h3{
	font-size: 2.4rem;
}
.post-share {
    padding: 10px;
}
/*-------------------- 事業内容 --------------------*/
.works {
    margin: 0 5px 0;
}
#pankuzu {
    margin-left: 0;
}
.works h2 {
	background: url(img/headline_works-800.gif) no-repeat;
	width: 100%;
	text-indent: -9999px;
	margin-left:0;
}
.works h3 {
    margin-left: 13px;
    border-bottom: 1px #535353 dotted;
    width: 100%;
	margin-left: 0;
}
.works #inside div.box {
	margin: auto;
	width: 310px;
	float: inherit;
}
.works #inside div.box img{
	width: auto;
	height:auto;
}
.works_left {
    float: inherit;
    margin-bottom: 40px;
}
.works_right {
	float: inherit;
	margin-bottom: 40px;
}
/*-------------------- アニメーション --------------------*/
.works_list1 {
	float: inherit;
	width: 100%;
	margin-right: 0;
	margin-bottom: 4em;
	text-align: center;
}
.works_list1 p{
	text-align: left;
}
.flash_player {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
}
/*-------------------- 地図 --------------------*/
.map {
    margin: 0 5px 0;
}
.map h2 {
	background: url(img/headline_map-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
.gmap {
	height: 0;
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	width: 94%;
}
.gmap iframe {
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
}
/*-------------------- 求人情報 --------------------*/
.recruit {
    margin: 0 5px 0;
}
.recruit h2 {
    background: url(img/headline_recruit-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
/*-------------------- お問い合せ --------------------*/
.contact {
    margin: 0 5px 0;
}
.contact h2 {
    background: url(img/headline_contact-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
.contact #contact_gameuser, .contact #contact_business {
    float: inherit;
    margin-left: auto;
    margin-right: auto;
    width: 280px;
}
.contact #contact_gameuser a {
    display: block;
    width: 250px;
    background-color: #ff9d05;
    text-shadow: 0 -1px 0px #ffa71e, 0 1px 0px #bf7400;
    color: #FFFFFF;
    text-align: center;
    margin: 15px auto 0;
    padding: 30px 15px;
    font-weight: bold;
    font-size: 2rem;
    margin: 30px 0;
    transition: opacity 0.6s;
}
.contact a.guidelinelink{
	color: #88d43b;
	font-weight:bold;
}
.contact #contact_business a {
    display: block;
    width: 250px;
    background-color: #44adf7;
    text-shadow: 0 -1px 0px #1486d6, 0 1px 0px #2771a5;
    color: #FFFFFF;
    text-align: center;
    margin: 15px auto 0;
    padding: 30px 15px;
    font-weight: bold;
    font-size: 2rem;
    margin: 30px 0;
    transition: opacity 0.6s;
}
p.space_1 {
	margin-left: auto;
	margin-right: auto;
	width: 94%;
}
table.space_1 th,
table.space_1 td {
	display: block;
	width: 100%;
	box-sizing: border-box;
}
table.space_1 input,
table.space_1 textarea {
	box-sizing: border-box;
	padding: 0.5em;
	font-size: 1.4rem;
	width: 100%;
	margin: 0 auto 1em;
}
/*-------------------- プライバシーポリシー --------------------*/
.privacypolicy {
    margin: 0 5px 0;
}
.privacypolicy h2 {
    background: url(img/headline_privacypolicy-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
/*-------------------- 特定商取引法に基づく表示 --------------------*/
.sct {
    margin: 0 5px 0;
}
.sct h2 {
    background: url(img/headline_sct-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}/*-------------------- 資金決済法に基づく表示 --------------------*/
.settlement {
    margin: 0 5px 0;
}
.settlement h2 {
    background: url(img/headline_settlement-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
/*-------------------- 利用規約（乙女ゲーム） --------------------*/
.userpolicy_otome {
    margin: 0 5px 0;
}
.userpolicy_otome h2 {
    background: url(img/headline_userpolicy_otome-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}
/*-------------------- 配信ガイドライン --------------------*/
.guideline {
    margin: 0 5px 0;
}
.guideline h2 {
    background: url(img/headline_guideline-800.gif) no-repeat;
    width: 92%;
	text-indent: -9999px;
	margin-left:0;
}

/* デザイン(小さなサイズPC　タブレット　) */
@media screen and (min-width: 531px){
	.post_thumbnail img {
		max-height:150px;
	}
	.post-li {
		padding-bottom: 2em;
	}
	.swiper-container2 .swiper-slide{
		height:380px;
	}
	#titlelist li,#titleanime li {
	}
	#headline h3,#pickup h3, #titlelist h3, #titleanime h3 {
		font-size: 1.2rem;
		margin-bottom: 0;
		padding-bottom: 0;
		min-height: 3em;
	}
	#headline h3.small, #pickup h3.small, #titlelist h3.small, #titleanime h3.small {
	}
	#titleanime .smooth {
		height: 40px;
	}
	#headline h5, #pickup h5, #titlelist h5, #titleanime h5 {
		border-top-left-radius: 20px;
		border-bottom-left-radius: 20px;
		margin-top: 5px;
		font-size: 1.4rem;
		color: #000;
	}
	#twitter {
		height: 300px;
		max-width: 700px;
		margin-left: auto;
		margin-right: auto;
		border: 2px solid #00acee;
		width: calc(100% - 4px);
	}
	.another-area {
		display: flex;
		justify-content: center;
		flex-flow: column;
		align-items: center;
	}
	#contact {
		width: 100%;
		margin-top: 2em;
	}
	#primary-sidebar {
		width: 40%;
		margin-top: 4em;
	}
	#contact h3{
		font-size: 2.4rem;
	}
	#contact a{
		font-size: 2.0rem;
	}
	.term ul {
		display: flex;
		justify-content: space-between;
		width: 100%;
	}
}
@media screen and (min-width: 710px){
	#titlelist ul,#titleanime ul {
	grid-template-columns: 33% 33% 33%;
	}
	.post_thumbnail {
		width: 300px;
		height: 300px;
}
	.post_thumbnail img {
		max-height: inherit;
	}
}
/* デザイン(PC) */
@media screen and (min-width: 1000px){
	a  ,a .post_thumbnail img {	
		transition: all 0.5s;
	}
	a:hover,a:hover .post_thumbnail img {
		text-decoration:none;
		opacity: 0.5; 
		transition: all 0.5s;
	}
	a:hover img {
		opacity: inherit;
	}
	#logo {
		margin: 0 auto;
		height: 90px;
		width: 375px;
	}
	#logo img {
		width: 375px;
	}
	.catch img {
		max-width: 860px;
		width:100%;
	}
	.catch {
		height: 80px;
	}
	.renewtext {
		height: 140px;
	}
	#topimg {
		width: 922px;
	}
	.renewtext h1 br {
		display: none;
	}
	.renewtext h1 {
		font-size: 160%;
		font-weight: normal;
	}
	.post_thumbnail {
		width: 300px;
		height: 300px;
	}
	#footer {
		font-size: 1.6rem;
	}
	#footer p {
		font-size: 1.2rem;
	}
	/*-------------------- home --------------------*/
	#topics {
		padding: 3em;
	}
	article.topicsshell {
	    max-width: 1000px;
		padding: 1em;
	}
	#headline > div,#pickup > div,#titlelist > div,#titleanime > div,#sns > div,#works > div{
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	}
	.post-li {

	}
	.pickupover {
		display: flex;
		grid-column: span 3;
	}
	.pickupover .box {
		width:50%;
	}
	.pickupovertext{
		width:40%;
		margin-left:1em;
	}
	.pickupovertext .type {
		height: 33px;
		line-height: 33px;
	}
	.pickupovertext .type span{
		font-size: 2.4rem;
	}
	#pickup .pickupovertext h3{
		font-size: 5rem;
		min-height: 1em;
		line-height: 1.6;
	}
	.pickupovertext .link {
		line-height: 1;
		font-size: 3rem;
		height: 1.4em;
	}
	#pickup .pickupovertext h5{
		font-size: 1.4rem;
	}
	.pickupunder ul {
	}
	#pickup li.pickupover {
		margin: 0;
		margin-bottom: 24px;
	}
	#headline li.pickupunder, #pickup li.pickupunder, #titlelist li, #titleanime li {
		margin: 0 0 4em;
	}
	.pickupunder .box {
		max-width: 310px;
	}
	#headline ul{
		display:grid; 
		grid-template-columns: minmax(100px,465px) minmax(100px,465px);
		justify-content: space-between;
		margin: 0 1em;
	}
	#pickup ul{
		display:grid; 
		grid-template-columns: minmax(100px,310px) minmax(100px,310px) minmax(100px,310px);
		justify-content: space-between;
		margin: 0 1em;
	}
	.gridlist {
		display: grid;
		grid-template-columns: 714px 254px;
		grid-template-rows: 470px 470px 470px 470px 470px 470px 470px 470px;
		margin: 0 1em;
	}
	#titlelist ul.gamelist{
		width:714px;
	}
	#titleanime ul.animelist{
		width:254px;
	}		
	#titlelist ul.gamelist {
		grid-template-columns: minmax(100px,206px) minmax(100px,206px) minmax(100px,206px);
		justify-content: space-between;
	}
	main #titlelist ul.animelist {
		grid-template-columns: minmax(100px,206px) ;
		justify-content: space-between;
		padding-left: 23px;
        margin-left: 22px;
        border-left: 1px solid #e0d0b1;
	}
	#titlelist li,#titleanime li {
		max-width: 206px;
		margin: 0 0 4em;
		height: 470px;
	}
	.youtube {
	    width: 100%;
	    display: flex;
	    justify-content: space-around;
	}
	.youtube div{
	    width: 47%;
	    aspect-ratio: 16 / 9;
	}
	#headline h3,#pickup h3,#titlelist h3,#titleanime h3{
		font-size: 1.6rem;
	}
	#headline h3.small, #pickup h3.small, #titlelist h3.small , #titleanime h3.small {
	}
	.type span {
		font-size: 1.2rem;
	}
	#twitter {
	}
	.oh-works,.oh-works-down{
		display:flex; 
		justify-content: center;
		align-items: stretch;
	}
	.oh-works-down{
	}
	.oh-works li a img,.oh-works-down li a img{
		width: 100%;
}
	.topics_switch_banner {
		max-width: 425px;
		margin-top: 1em;
		margin-left: auto;
		margin-right: auto;
	}
	.link_banner {
		display: flex;
		justify-content: space-between;
		margin-top: 1em;
		font-size:1.6rem;
	}
	.link_banner > div {
		padding:0 0.5em;
	}
	.another-area {
	}
	#contact {
		margin-left: inherit;
		margin-right: inherit;
	}
	#contact, #primary-sidebar {
	}
	.sph2{
		display:none;
	}
	.pch2{
		display:block;
		float: right;
        padding-right: 95px;
		}
	/*-------------------- Topics --------------------*/
	.topics #inside a{
		color:#1a0dab;
	}
	/*-------------------- 事業内容 --------------------*/
	.works #inside div.box {
		margin: 0 16px 0 0;
		width: 310px;
		float: left;
	}
	.works #inside div#starlet,.works #inside div#terzetto {
		width: 206px;
	}
	.works #inside div.box img.terzettoimg{
		width: 206px;
	}
	.works_left {
		float: left;
	}
	.works_right {
		float: right;
	}
	/*-------------------- アニメーション --------------------*/
	.works_list1 {
		float: left;
		width: 180px;
		margin-right: 55px;
		margin-bottom: 0;
	}
	.flash_player {
		margin-left: auto;
		margin-right: auto;
		width: 507px;
	}
	/*-------------------- 会社概要 --------------------*/
	.company h2 {
		width: 100%;
	}
	#main {
		width: 800px;
		margin-left: auto;
		margin-right: auto;
	}
	/*-------------------- お問い合せ --------------------*/
	.contact h2 {
		width: 100%;
	}
	.contact #contact_gameuser, .contact #contact_business {
		margin-left: 0;
		margin-right: 0;
	}
	.contact #inside {
		display: flex;
		justify-content: space-around;
	}
}

/*-------------------- ハンバーガーメニュー--------------------*/
/*nav*/
body.noscroll{
  /*overflow: hidden;*/
}
.panel-btn {
	display: block;      
	width: 40px;      
	height: 40px;      
	position: relative;      
	z-index: 3;
	border:none; 
	cursor: pointer;  
	float: right; 
}
.panel-btn::after {
    content: "";
    display: block;
    clear: both;
}   
.bar {      
	width: 40px;      
	height: 5px;        
	display: block;      
	position: absolute;      
	left: 50%;      
	transform: translateX(-50%);      
	background-color:rgba(80,193,224,0.3);
}    
.bar_top {   
	top: 10px;
}
.bar_mid {    
	top: 50%;
	transform: translate(-50%,-50%);
}
.bar_bottom {
	bottom: 10px;
}
.panel-btn.close .bar_top {      
	transform: translate(-50%,10px) rotate(45deg);      
	transition: transform .3s;    
}
.panel-btn.close .bar {
	background-color: #ffffff;
}
.panel-btn.close .bar_mid {      
	opacity: 0;       
	transition: opacity .3s;    
}    
.panel-btn.close .bar_bottom {      
	transform: translate(-50%,-5px) rotate(-45deg);      
	transition: transform .3s;    
}
#header .panel {      
	transform: translateX(100%);      
	transition: .3s;      
	width: 200px;      
	height: 100vh;      
	position: fixed;      
	top: 0;      
	right: 0;      
	z-index: 2;
}
#header .panel.slide-in {      
	transform: translateX(0);
	transition: .3s;     
}    
.panel-inner {        
	width: 100%;        
	height: 100%;        
	background-color:rgba(80,193,224,0.3);
	z-index: 2;
}
.panel-inner .gnav-inner {
	margin-top: 30px;
}   
#header .gnav {        
	display: block;        
	text-align: center;
	margin-top: 60px;
}      
.gnav-li {
	margin-right: 0;
	margin-bottom: 30px;
	font-family: acumin-pro, sans-serif;
	font-weight: 800;
	font-size: 6.8vw;
}
.panel-inner .gnav-li {
	margin-bottom: 20px;
}
.header-inner {
	margin: 0 0.25em;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 3;
}
.panel-inner a {
	transition: 0.3s;
	border-bottom: 2px rgba(255,255,255,0.2) solid;
	white-space: nowrap;
}
.panel-inner a:hover {
	border-bottom-color: #fff;
}
.panel-inner .visit a {
	color: #000;
	border-bottom-color: #000;
}
@media (min-width: 768px) {
	.panel-btn {
		width: 60px;
		height: 50px;
		margin-top: 10px;
	}
	.panel-btn.close .bar_top {
		transform: translate(-50%,10px) rotate(45deg);
	}
	.panel-btn.close .bar_bottom {
		transform: translate(-50%,-15px) rotate(-45deg);
	}
	.gnav-li {
		font-size: 2.4rem;
	}
	.bar {
		width: 40px;
	}
}
@media (min-width: 1200px) {/* 1200px以上*/
	body{
	font-size: 1.6rem;
	}
	h1 {
		font-size: 3.6rem;/* 36px*/
	}
	h2 {
		font-size: 2.4rem;/* 24px*/
	}
}