@charset "utf-8";
/* CSS Document */
@media only screen and ( max-width:768px ){
	html, body { width:100%; height: 100%; }

	.gf_conts { display:none; }
	div#gf_header { height: 0px !important; }
	#gf_footer_link { display:none; }
	#gf_footer { display:none; }
	.textsizeS { font-size:12px; }
	.pa4 { padding:4%; }
	.paLeft4 { padding-left:4%; }
	
	/*トップページ =================================*/
	/*ヘッダー　====================================*/
	#leftCont { display:none; }
	#menuPc {display:none; }
	#menuSp {display:block; }
	.menu__checkbox--hidden { display:block; }
	
	#menuTop { background-color: #0066cc; width:100%; min-width:320px; height:auto; padding:0; }
	.spLogo { display:inline-block; width:56%; height:auto; vertical-align:top; }
	.snsBox { display:inline-block; width:28%; height:auto; vertical-align:top; }
	.btnTW { width:50%; height:auto; vertical-align:top; }
	.btnFB { width:50%; height:auto; vertical-align:top; }
	
	/*フッター =====================================*/
	
	/*メニュー　====================================*/
	
	.sptwitter{display: block;width: 90%; margin: 35px auto;}
	.sptwitterArea{display: block; margin-top: 25px!important;}
	
	.header {
	  width: 100%;
		height: 100px;
	  z-index: 3;
	   }
	  .header h1 {
		text-align: center;
		font-size: 25px;
		font-size: 2.5rem;
		padding: 20px 40px 20px 0px;
		color: #fff; }
	  .header .header__heading {
		background: #0066cc;
		position: absolute;
		width: 100%;
		z-index: 3;
		border-bottom: #cdcdcd 1px solid;
		}
	
	.sp_img img{
		width:80%;
	}
	
	.sp_img2 img{
		width:98%;
	}
	.nav-content {
	  position: absolute;
	  width: 100%;
	  top: -735px;
	  z-index: 2;
	  -webkit-transition: 1.5s top;
			  transition: 1.5s top; }
			  
		.nav-content ul li a {
		  display: block;
		  padding: 4%;
		  color: #fff;
		  font-size:170%;
		   }
	
	.is-open .nav-content {
	  top: 10%;
	   }
	
	#js-cover {
	  background: #000;
	  width: 100%;
	  height: 100%;
	  display: block;
	  position: absolute;
	  top: 0px;
	  opacity: 0;
	  z-index: 1; }
	
	.menu-button {
	  width: 40px;
	  height: 40px;
	  display: block;
	  position: absolute;
	  right: 6%;
	  top: 32%;
	 }
	 
	  .menu-button i {
		display: block;
		width: 40px;
		height: 2px;
		border-radius: 3px;
		background: #fff;
		-webkit-transition: background 0.5s;
				transition: background 0.5s;
		position: relative;
		left: 5px;
		top: 14px; }
		.menu-button i:before,
		.menu-button i:after {
		  content: "";
		  display: block;
		  width: 40px;
		  height: 2px;
		  border-radius: 3px;
		  background: #fff;
		  position: absolute;
		  -webkit-transform: rotate(0deg);
			  -ms-transform: rotate(0deg);
				  transform: rotate(0deg);
		  -webkit-transition: all 0.3s !important;
				  transition: all 0.3s !important; }
		.menu-button i:before {
		  -webkit-transform: translateY(8px);
			  -ms-transform: translateY(8px);
				  transform: translateY(8px); }
		.menu-button i:after {
		  -webkit-transform: translateY(-8px);
			  -ms-transform: translateY(-8px);
				  transform: translateY(-8px); }
	
	.is-open .menu-button i {
	  background: #0066cc; }
	  .is-open .menu-button i:after {
		-webkit-transform: translateY(0px) rotate(-45deg);
			-ms-transform: translateY(0px) rotate(-45deg);
				transform: translateY(0px) rotate(-45deg); }
	  .is-open .menu-button i:before {
		-webkit-transform: translateY(0px) rotate(45deg);
			-ms-transform: translateY(0px) rotate(45deg);
				transform: translateY(0px) rotate(45deg); }
	


	

	#releaseDate {
		background-image:url(../img/smort/common/releaseDatebg.jpg);
		background-repeat:no-repeat;
		background-size: cover;
		width:100%;
		min-width:184px;
		height:auto;
		padding:4% 16% 4% 16%;
		text-align:center;
		color:#0066cc;
		font-size:24px;
		font-weight:bold;
		}
	
	.menu li {
		background-image:url(../img/smort/common/menuBg.jpg);
		background-repeat:no-repeat;
		background-position:right center;
		background-size: cover;
		border-bottom:#CCCCCC solid 1px;
		font-size:14px;
	}
	.borderTop { border-top:#CCCCCC solid 2px; }
	.menu a { color:#fff; text-decoration: none; }
	.menu .block { display:block; }
	
	
	/*スライダー =====================================*/
	.slider-pro {
		width: 100% !important;
		}
	
	.slider-pro p.sp-layer {
		bottom: 0;
		top: auto !important;
		left: 0 !important;
		width: 100%;
		border-bottom-left-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-left-radius: 6px; /* Firefox用 */
	}
	
	.slider-pro p.sp-layer .title {
		font-size:2rem;
		font-weight:bold;
	}
	
	.slider-pro p.sp-layer .title_sp{
		font-size:2rem;
		font-weight:bold;
		}
	
	.slider-pro p.sp-layer .name {
		font-size:1.4rem;
	}
	
	.slider-pro p.sp-layer .name2 {
		font-size:0.7rem;
	}
	
	
	/*更新情報 =======================================*/
	#update {
		display:block;
		background-color: #0066cc;
		padding:4%;
	}
	
	#update #title {
		width:100%;
		height:36px;
		background-color:#55acee;
		padding: 6px 0 0 14px;
		border-top-right-radius: 6px; /* CSS3草案 */ 
		-webkit-top-right-radius: 6px; /* Safari,Google Chrome用 */
		-moz--top-right-radius: 6px; /* Firefox用 */
		border-top-left-radius: 6px;
		-webkit-top-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--top-left-radius: 6px; /* Firefox用 */
	}
	#update #title p {
		color:#FFFFFF;
		font-weight:bold;
		font-size:120%;
	}
	.news {
		height:124px;
		background-color:#ffffff;
		overflow: scroll;   /* スクロール表示 */ 
		overflow-x: hidden;
    	padding: 3%;
	}
	.news dt{
		width:16%;
		font-size:24px !important;
		float:left;
		clear:left;
	}
	dd {
		width:78%;
		font-size:24px !important;
		float:left;
	}
	
	#update #footer {
		width:100%;
		height:6px;
		background-color:#ffffff;
		border-bottom-right-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-right-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-right-radius: 6px; /* Firefox用 */
		border-bottom-left-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-left-radius: 6px; /* Firefox用 */
	}
	
	/*バナー =======================================*/
	#brnner {
		width:100%;
		height:auto;
		background-color:#0066cc;
		padding:0% 4% 4% 4%;
	}
	#brnner img { display:inline-block; width:49%; height:auto; margin-bottom: 2%; }
	.width100pa { width:100% !important; }
	
	/*最新刊 ========================================*/
	.release {
		width:100%;
		height:auto;
		margin: 0 auto;
	}
	.heading { position:relative; width:100%; background-color:#000000; padding:8px 0 8px 12px; margin-bottom:16px; }
	.headingTaitle { color:#FFFFFF; font-weight:bold; font-size:120%; }
	.headingReleasedate { position:absolute; color:#FFFFFF; font-size:120%; font-weight:bold; right:68px; padding-top: 0px; }
	.headingReleasedate2 { position:absolute; color:#FFFFFF; font-size:120%; font-weight:bold; right:10px; padding-top: 0px; }
    
    .Releasedate3{font-size: 16px;
        font-weight: bold;
        padding-bottom: 5px;
        border-bottom: 2px solid #000;
        margin-bottom: 15px;}
    
	.headingBtn { position:absolute; background-image:url(../img/common/yajirushi.png);background-size: cover; width:54px; height:42px; background-color:#606060; right:-28px; margin:-8px 28px 0 0; }
	
	.contBox { display:inline-block; width:25%; height:auto; padding: 0% 1% 2% 1%;; vertical-align: top; }
	.contBox img { display: block; width:98%; height:auto; margin-bottom:6px; border:#E0E0E0 solid 1px; }
	.contBox h3 { font-weight:bold; font-size:140%; line-height:130%; margin-bottom:6px; }
	.contBox p{ font-size:120%; line-height:130%; }
	.contBox a{ font-size:120%; color:#ff0066; }
	
	.contBox2 { display:inline-block; width:100%; height:auto; vertical-align: top; margin-bottom: 4%x; }
	.contBox2 h3 { font-weight:bold; font-size:140%; line-height:130%; margin-bottom:2px; margin-left: 4%; }
	/*.contBox2 p{ font-size:120%; line-height:130%; border-bottom:#BFBFBF solid 1px; padding-left: 4%; padding-bottom: 2%; margin-bottom:2%; }*/
	.marginR { margin-right:0px !important; }
	
	.banner { display:inline-block; width:29%; height:auto; margin:2% 2%;}
	.banner img { width:100%; height:auto; }
	
	/*ページトップへ ===============================*/
	#page-top { display:block !important; }
	.pageTop {
		display:block !important;
		width:100%;
		height:auto;
		background-color:#0066cc;
		color:#fff;
		font-weight:bold;
		text-decoration:none;
		text-align:center;
		margin-top: 2%;
		padding:4%;
	}
	
	/*お見舞い ====================================*/
	#sympathy {
		width: 90%;
		margin: 0 auto;
		border: #000 1px solid;
		padding: 10px;
		margin-top: 6%;
		margin-bottom: 6%;
	}
	#sympathy span{
		font-size: 120%;
		font-weight: bold;
	}
	
	.edit {
		float: right;
	}
	
	
	/*下層ページ ====================================*/
	/*刊行予定 ======================================*/
	
	#heder { background:none !important;	}
	
	
		.gabook{ padding: 6px;
    background-color: #55acee;
    width: 98%; color: #FFF;}
	
	
.contBox2 { display:inline-block; width:100%; height:auto; vertical-align: top; margin-bottom: 4%x; padding-top: 1%;}
	.contBox2 h3 { font-weight:bold; font-size:14px; line-height:130%; margin-bottom:2px; margin-left: 4%; }
	.contBox2 p{ font-size: 12px;
    line-height: 130%;
    border-bottom: #BFBFBF solid 1px;
    padding-left: 4%;
    padding-bottom: 2%; }
	
}


@media only screen and ( max-width:480px ){
	
	html, body { width:100%; height: 100%; }

	.gf_conts { display:none; }
	div#gf_header { height: 0px !important; }
	#gf_footer_link { display:none; }
	#gf_footer { display:none; }
	.textsizeS { font-size:12px; }
	.pa4 { padding:4%; }
	.paLeft4 { padding-left:4%; }
	
	/*トップページ =================================*/
	/*ヘッダー　====================================*/
	#leftCont { display:none; }
	#menuPc {display:none; }
	#menuSp {display:block; }
	.menu__checkbox--hidden { display:block; }
	
	#menuTop { background-color: #0066cc; width:100%; min-width:320px; height:auto; padding:0; }
	.spLogo { display:inline-block; width:56%; height:auto; vertical-align:top; }
	.snsBox { display:inline-block; width:28%; height:auto; vertical-align:top; }
	.btnTW { width:50%; height:auto; vertical-align:top; }
	.btnFB { width:50%; height:auto; vertical-align:top; }
	
	/*フッター =====================================*/
	
	/*メニュー　====================================*/
	
	.header {
	  width: 100%;
		height: 50px;
	  z-index: 3;
	   }
	  .header h1 {
		text-align: center;
		font-size: 25px;
		font-size: 2.5rem;
		padding: 20px 40px 20px 0px;
		color: #fff; }
	  .header .header__heading {
		background: #0066cc;
		position: absolute;
		width: 100%;
		z-index: 3;
		border-bottom: #cdcdcd 1px solid;
		}
	
	.nav-content {
	  position: absolute;
	  width: 100%;
	  top: -735px;
	  z-index: 2;
	  -webkit-transition: 1.5s top;
			  transition: 1.5s top; }
			  
		.nav-content ul li a {
		  display: block;
		  padding: 4%;
		  color: #fff; }
	
	.is-open .nav-content {
	  top: 8.8%;
	   }
	
	#js-cover {
	  background: #000;
	  width: 100%;
	  height: 100%;
	  display: block;
	  position: absolute;
	  top: 0px;
	  opacity: 0;
	  z-index: 1; }
	
	.menu-button {
	  width: 30px;
	  height: 30px;
	  display: block;
	  position: absolute;
	  right: 4%;
	  top: 28%;
	 }
	 
	  .menu-button i {
		display: block;
		width: 20px;
		height: 2px;
		border-radius: 3px;
		background: #fff;
		-webkit-transition: background 0.5s;
				transition: background 0.5s;
		position: relative;
		left: 5px;
		top: 8px; }
		.menu-button i:before,
		.menu-button i:after {
		  content: "";
		  display: block;
		  width: 20px;
		  height: 2px;
		  border-radius: 3px;
		  background: #fff;
		  position: absolute;
		  -webkit-transform: rotate(0deg);
			  -ms-transform: rotate(0deg);
				  transform: rotate(0deg);
		  -webkit-transition: all 0.3s !important;
				  transition: all 0.3s !important; }
		.menu-button i:before {
		  -webkit-transform: translateY(8px);
			  -ms-transform: translateY(8px);
				  transform: translateY(8px); }
		.menu-button i:after {
		  -webkit-transform: translateY(-8px);
			  -ms-transform: translateY(-8px);
				  transform: translateY(-8px); }
	
	.is-open .menu-button i {
	  background: #0066cc; }
	  .is-open .menu-button i:after {
		-webkit-transform: translateY(0px) rotate(-45deg);
			-ms-transform: translateY(0px) rotate(-45deg);
				transform: translateY(0px) rotate(-45deg); }
	  .is-open .menu-button i:before {
		-webkit-transform: translateY(0px) rotate(45deg);
			-ms-transform: translateY(0px) rotate(45deg);
				transform: translateY(0px) rotate(45deg); }
	


	

	#releaseDate {
		background-image:url(../img/smort/common/releaseDatebg.jpg);
		background-repeat:no-repeat;
		background-size: cover;
		width:100%;
		min-width:184px;
		height:auto;
		padding:4% 4% 4% 9%;
		text-align:center;
		color:#0066cc;
		font-size:16px;
		font-weight:bold;
		}
	
	.menu li {
		background-image:url(../img/smort/common/menuBg.jpg);
		background-repeat:no-repeat;
		background-position:right center;
		background-size: cover;
		border-bottom:#CCCCCC solid 1px;
		font-size:8px;
	}
	.borderTop { border-top:#CCCCCC solid 2px; }
	.menu a { color:#fff; text-decoration: none; }
	.menu .block { display:block; }
	
	
	/*スライダー =====================================*/
	.slider-pro {
		width: 100% !important;
		}
	
	.slider-pro p.sp-layer {
		bottom: 0;
		top: auto !important;
		left: 0 !important;
		width: 100%;
		border-bottom-left-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-left-radius: 6px; /* Firefox用 */
	}
	
	.slider-pro p.sp-layer .title {
		font-size:1.4rem;
		font-weight:bold;
	}
	
	.slider-pro p.sp-layer .title_sp{
		font-size:1.1rem;
		font-weight:bold;
		}
	
	.slider-pro p.sp-layer .name {
		font-size:1rem;
	}
	
	
	/*更新情報 =======================================*/
	#update {
		display:block;
		background-color: #0066cc;
		padding:4%;
	}
	
	#update #title {
		width:100%;
		height:36px;
		background-color:#55acee;
		padding: 6px 0 0 14px;
		border-top-right-radius: 6px; /* CSS3草案 */ 
		-webkit-top-right-radius: 6px; /* Safari,Google Chrome用 */
		-moz--top-right-radius: 6px; /* Firefox用 */
		border-top-left-radius: 6px;
		-webkit-top-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--top-left-radius: 6px; /* Firefox用 */
	}
	#update #title p {
		color:#FFFFFF;
		font-weight:bold;
	}
	.news {
		height:124px;
		background-color:#ffffff;
		overflow: scroll;   /* スクロール表示 */ 
		overflow-x: hidden;
    	padding: 3%;
	}
	.news dt{
		width:16%;
		font-size:16px !important;
		float:left;
		clear:left;
	}
	dd {
		width:78%;
		font-size:16px !important;
		float:left;
	}
	
	#update #footer {
		width:100%;
		height:6px;
		background-color:#ffffff;
		border-bottom-right-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-right-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-right-radius: 6px; /* Firefox用 */
		border-bottom-left-radius: 6px; /* CSS3草案 */ 
		-webkit-bottom-left-radius: 6px; /* Safari,Google Chrome用 */
		-moz--bottom-left-radius: 6px; /* Firefox用 */
	}
	
	/*バナー =======================================*/
	#brnner {
		width:100%;
		height:auto;
		background-color:#0066cc;
		padding:0% 4% 4% 4%;
	}
	#brnner img { display:inline-block; width:49%; height:auto; margin-bottom: 2%; }
	.width100pa { width:100% !important; height: auto;}
	
	/*最新刊 ========================================*/

	
	.release {
		width:100%;
		height:auto;
		margin: 0 auto;
	}
	.heading { position:relative; width:100%; background-color:#000000; padding:8px 0 8px 12px; margin-bottom:16px; }
	.headingTaitle { color:#FFFFFF; font-weight:bold; }
	.headingReleasedate { position:absolute; color:#FFFFFF; font-size:12px; font-weight:bold; right:68px; padding-top: 3px; }
	.headingReleasedate2 { position:absolute; color:#FFFFFF; font-size:12px; font-weight:bold; right:10px; padding-top: 3px; }
	.headingBtn { position:absolute; background-image:url(../img/common/yajirushi.png);background-size: cover; width:54px; height:42px; background-color:#606060; right:-28px; margin:-8px 28px 0 0; }
	
	.contBox { display:inline-block; width:50%; height:auto; padding: 4% 2% 2% 2%;; vertical-align: top; }
	.contBox img { display: block; width:98%; height:auto; margin-bottom:6px; border:#E0E0E0 solid 1px; }
	.contBox h3 { font-weight:bold; font-size:14px; line-height:130%; margin-bottom:6px; }
	.contBox p{ font-size:12px; line-height:130%; }
	.contBox a{ font-size:12px; color:#ff0066; }
	
	.contBox2 { display:inline-block; width:100%; height:auto; vertical-align: top; margin-bottom: 4%x; padding-top: 1%;}
	.contBox2 h3 { font-weight:bold; font-size:14px; line-height:130%; margin-bottom:2px; margin-left: 4%; }
	.contBox2 p{ font-size: 12px;
    line-height: 130%;
    border-bottom: #BFBFBF solid 1px;
    padding-left: 4%;
    padding-bottom: 2%; }
	.marginR { margin-right:0px !important; }
	
	.banner { display:inline-block; width:45%; height:auto; margin:2% 2%;}
	.banner img { width:100%; height:auto; }
	
	/*ページトップへ ===============================*/
	#page-top { display:block !important; }
	.pageTop {
		display:block !important;
		width:100%;
		height:auto;
		background-color:#0066cc;
		color:#fff;
		font-weight:bold;
		text-decoration:none;
		text-align:center;
		margin-top: 2%;
		padding:4%;
	}
	
	/*お見舞い ====================================*/
	#sympathy_wrapper{background:#0066CC;
padding-top: 2%;
padding-bottom: 5%;}
	
	#sympathy {
		width: 90%;
		margin: 0 auto;
		border: #000 1px solid;
		padding: 10px;
		background:#ffffff;
	}
	
	#sympathy span{
		font-size: 120%;
		font-weight: bold;
		line-height: 1.4em;
	}
	
	#sympathy p{text-align: right; font-size: 90%;}
	
	.edit {
		float: right;
	}
	
	
	/*下層ページ ====================================*/
	/*刊行予定 ======================================*/
	
	#heder { background:none !important;}
}