@charset: 'utf-8';

.is_pc .switch_sp{ display: none;}
.is_sp .switch_pc{ display: none;}


a{
	margin: 0px;
	padding: 0px;
}

ul,li{ margin: 0; padding: 0; }
body {
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.8;
	letter-spacing:1px;
	background-attachment: fixed;
	background-image: url(images/back.jpg);
	background-position: center top;
	color: #302B21;
	}
	
#wrapper{
	margin: 0 auto;
	background: url(images/base.jpg) repeat-y center top; 
	background-attachment: fixed;
	text-align: center;
    position: relative;
}

#question{
    max-width: 800px;
    margin: 0 auto;
}

.b{
    max-width: 530px;
	font-size: 22px;
	text-align: left;
	line-height: 1.8em;
	font-family: 'ハルクラフト' !important;
	overflow: hidden;
	color: #FF0000;
	position: relative;
	top: 1px;
	left: 5px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.img_yodogawa{
    position: relative;
    bottom: -5px;
}

.is_pc .b .ruby{ width: inherit; display: inline-block; position: relative;}
.is_pc .b .ruby span{
    width: 100%;
    text-align: center;
    font-size: 50%;
    line-height: 1em;
    letter-spacing: 0;
    white-space: nowrap;
    position: absolute;
    top: -4px;
    left: 0;
}

.parts_hint img{
    margin: -5px 0 0 0;
}

table td{ vertical-align: middle;}

#caption {
  background-color: #000;
}

.midashi {
	font-size: 15px;
	line-height: 1.5;
	font-weight:bold;
	color:#586095;
	letter-spacing:2px;
}


/* むしめがね */

.is_pc .loupe_img {
  margin: -8px 0 0 -12px;
  position: relative;
  top: 0px;
  width: 215px;
  height: 215px;
  background-image:url(images/glass2.png);
}

.is_pc .loupe_circle {
  background-image:url(images/glass.png);
}

/* こたえ */
.mese {
	font-size: 20px;
	line-height: 1.4;
	font-family:Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	}

.data {
	font-size: 13px;
	line-height: 1.4;
	font-family:Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	}
	
.profile {
	font-size: 25px;
	line-height: 1.4;
	font-weight:bold;
	font-family:Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	}
	
.title {
	font-size: 35px;
	color: #FFF;
	}
	
.a {
	font-size: 35px;
	line-height: 1.4;
	font-family:Georgia, "Times New Roman", Times, serif;
	color: #FFF;
	}

.cap {
	font-size: 12px;
	line-height: 1.4;
	color: #FFF;
	}

.day {
	font-size: 12px;
	line-height: 1.4;
	}



/*　リンク　*/

a:link{ color: #BF0060; font-weight:bold; text-decoration: none; }
	 
a:visited{ color: #666666; font-weight:bold; text-decoration: none; }
	 
a:hover{ color: #FF1E6F; font-weight:bold; text-decoration: none;}




/* ------------------------------------------------------------------------------------------
*
*
    SP VIEW
*
 ------------------------------------------------------------------------------------------ */ 
.is_sp .mask_layer *,
.is_sp .mask_layer{
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.is_sp #wrapper{
    padding: 40px 0;
}

.is_sp .b{
    padding: 0 20px 0 0;
	font-size: 28px;
	text-align: left;
	line-height: 1.8em;
	color: #FF0000;
	position: relative;
	top: 1px;
	left: 5px;
}

.is_sp .img_yodogawa{
    position: relative;
    bottom: -20px;
}

.is_sp .b .ruby{ width: inherit; display: inline-block; position: relative;}
.is_sp .b .ruby span{
    width: 100%;
    text-align: center;
    font-size: 60%;
    line-height: 1em;
    letter-spacing: 0;
    white-space: nowrap;
    position: absolute;
    top: -8px;
    left: 0;
}

.is_sp .indent{ margin-left: -.5em;}

.is_sp .txt_yodogawa{
    padding: 0 5%;
    margin: 20px 0 40px 0;
    font-size: 32px;
	font-family: 'ハルクラフト' !important;
    font-weight: bold !important;
    text-align: left;
}


.is_sp .txt_yodogawa .ruby{ width: inherit; display: inline; position: relative;}
.is_sp .txt_yodogawa .ruby span{
    width: 100%;
    text-align: center;
    font-size: 70%;
    line-height: 1em;
    letter-spacing: 0;
    white-space: nowrap;
    position: absolute;
    top: -23px;
    left: 0;
}

.is_sp .txt_yodogawa span.small{
    font-size: 60%;
}

.is_sp #answer{
    height: 100vh;
    min-height: 100vh;
    background-color: #000;
}

 .is_sp table{
     width: 100%;
     text-align: center;
}

.is_sp table table{
    text-align: center;
}

.is_sp table table table{
     width: auto;
}

.is_sp #curtain{
    position: relative;
    z-index: 100;
}

.is_sp .mask_layer{
    width: 800px;
    height: 600px;
    background-image:url(./images/main_base_01.gif);
    z-index: 1;
    position: relative;
}

.is_sp .mask_inner_layer{
    width: 800px;
    height: 600px;
    background-color:#FFF;
    -webkit-mask-image: url(images/glass_alpha.png);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 260px;
    -webkit-mask-mode: luminance;
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    z-index: 10;
}

.is_sp .parts_loupe{
    width: 800px;
    height: 600px;
    background-image:url(./images/glass.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 260px;
    position: absolute;
    top: -14px;
    left: 0;
    z-index: 11;
}

.is_sp #answer_btn img{
    width: 400px;
    height: auto;
}

.is_sp .day{
    font-size: 18px;
}

.is_sp #answer .cap{ font-size: 30px;}
.is_sp #answer .mese{ font-size: 56px;}
.is_sp #caption div[align="left"] img{ width: 120px; height: auto;}
.is_sp #caption div[align="right"] a img{ width: 560px; height: auto;}

.is_sp #archive_list table{
    padding: 0;
    margin: 0;
}

.is_sp #archive_list td{
    margin: 0;
    padding: 0;
}

.is_sp #archive_list td td{
    width: 20%;
}

.is_sp #archive_list td table td tr td{
    width: auto;
}

.is_sp #archive_list td img{
    width: auto;
    margin: 0;
    height: 34px;
}

.is_sp #archive_list a img{
    width: 90%;
    height: auto;
}