﻿

body
{
	margin:0;
	text-align: left;
	color: #4841a9;
	font-size:100%;
	font-weight: 400;
	font-family: "Century Gothic", "YuGothic", "游ゴシック体", "Yu Gothic", "游ゴシック","Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}


a
{
	color:#4841a9;
    font-style:normal;
    text-decoration:none;
}
a:link 
{
	color:#4841a9;
    font-style:normal;
    text-decoration:none;
}
a:visited 
{
	color:#4841a9;
    text-decoration:none;
}
a:hover 
{
  	color:#4841a9;
    font-style:normal;
    text-decoration:none;
}
a:active 
{
	color:#4841a9;
    text-decoration:none;
}
#page_contents .img
{
	background-color: #fff1ed;
}

.hide
{
	display:none;
	order:10;
}


/*セクション - ナビ*/

#bottom
{
	width:100vw;
	height:60px;
	display:flex;
	justify-content: center;
	color:#ffffff;
    background-color: rgba(247, 161, 138,0.9);
	position: fixed;
	font-weight:800;
    bottom: 0; 
    z-index:10000;
    box-shadow: 0 0 50px rgba(0,0,0,0.05);
}
#bottom img
{
	height:100%;	
	display:flex;
	justify-content: center;
	margin: 0 auto;

}
#bottom a{width:100vw;height:100%;}



#navi
{
	background-color:#fff;
	position: fixed;
	margin:0;
	font-size:17px;
	width 			:100%;
	height 			:120px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	padding			:0;
	/*border-top:1px solid #dddddd;*/
	outline-bottom:1px solid rgba(0,0,0,0.1);
	z-index: 10000;
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
}

#navi li
{
	background-color:#fff;
	text-align	:center;
	margin		:0;
	list-style	:none;
	border-bottom:1px solid #f0f0f0;
	flex-basis		:12%;
	/*border-right:1px solid #dddddd;*/
}


#navi li a
{
	padding:5px 0 5px 0;
	color : #4841a9;
	font-size:80%;
	font-weight:800;
	height		:70px;
	display:block;
    text-decoration:none;
}


#navi li.contents a:hover
{
	color:#4841a9;
    text-decoration:none;
}



#navi li.logo		{flex-basis		:42%; z-index:10000;}
#navi li.logo a 	{padding		:0 10px 40px 10px;}
#navi li.logo img	{width			:100%;max-height:140px;}
/*#root #navi li.logo img	{width			:100%;max-height:200px;}*/
#navi li.fb			{flex-basis		:5%;}
#navi li.fb a 		{padding		:30px 0 20px 0;    }
#navi li.fb img		{width			:50px;}
#navi li.ig			{flex-basis		:5%;}
#navi li.ig a 		{padding		:30px 0 20px 0;    }
#navi li.ig img		{width			:50px;}
#navi li.tw			{flex-basis		:5%;}
#navi li.tw a 		{padding		:30px 0 20px 0;    }
#navi li.tw img		{width			:50px;}
#navi li.home 		{display:none;}
	
#navi li.logo.sp	{flex-basis		:70%;display:none;height: 80px;}
#navi li.logo.sp img{width			:180px;}
#navi li.logo.sp a 	{padding		:0 auto;}
#navi li.fb.sp		{flex-basis		:15%;display:none;height: 80px;    }
#navi li.fb.sp a 	{padding		:10px 0;}
#navi li.fb.sp img	{width			:80px;}
#navi li.ig.sp		{flex-basis		:15%;display:none;height: 80px;    }
#navi li.ig.sp a 	{padding		:10px 0;}
#navi li.ig.sp img	{width			:80px;}
#navi li.tw.sp		{flex-basis		:15%;display:none;height: 80px;    }
#navi li.tw.sp a 	{padding		:10px 0;}
#navi li.tw.sp img	{width			:80px;}
#navi .hilight		
{
	border-bottom	:3px solid #4841a9;
	color:#4841a9;
}


#navi li.contents img		{height			:100%;max-width:80%;padding-bottom:10px;}
#navi li.contents.home img	{height			:80px;max-width:100%;}
#navi li.contents img a 	{padding		:10px 0 20px 0;}

#navi_sub,
#navi_sub_sub
{
	background-color:#fff;
	position: fixed;
	width 			:100%;
	top:120px;
	outline:1px solid rgba(0,0,0,0.1);
	z-index: 9990;
	padding:0;
	overflow:hidden;
	height:78px;

}
#navi_sub_sub{top:190px;	z-index: 9980;}
#navi_sub .navi_sub_scroll,
#navi_sub_sub .navi_sub_scroll
{
	overflow-x:scroll;
}
#navi_sub .navi_sub_scroll::-webkit-scrollbar 
#navi_sub_sub .navi_sub_scroll::-webkit-scrollbar 
{
    height: 1px;
    background-color:rgba(0,0,0,0);
}

#navi_sub ul,
#navi_sub_sub ul
{
	font-size:17px;
	width 			:100%;
	/*max-width:1200px;*/
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	padding			:0;
	/*border-bottom:1px solid rgba(0,0,0,0.1);*/
	margin:0 auto;
	display: flex;
    flex-direction: row;
    justify-content: center;
}


#loc_list #navi_sub ul,
#loc_list #navi_sub_sub ul
{
	width 			:100%;
	min-width: 600px;
	justify-content: center;
}
#loc_list #navi_sub_sub.hiroshima ul	{min-width: 1700px;max-width: 1200px;}
#loc_list #navi_sub_sub.tokyo ul		{min-width: 700px;}


#navi_sub ul li,
#navi_sub_sub ul li
{
	background-color:#fff;
	text-align	:center;
	margin:0;
	list-style	:none;
	/*border-bottom:1px solid #f0f0f0;*/
	flex-basis		:auto;
	/*border-right:1px solid #dddddd;*/
	padding: 0 10px
}
#navi_sub_sub ul li{flex-basis		:auto;}
	
	
#navi_sub_sub ul li{display:none;}

#navi_sub ul li a,
#navi_sub_sub ul li a
{
	padding:30px 0 5px 0;
	height		:40px;
	display:block;
    text-decoration:none;
    color: #4841a9;
    font-weight:800;
    white-space:nowrap;
}

#navi_sub ul .hilight,
#navi_sub_sub ul .hilight		
{
	border-bottom	:3px solid #4841a9;
	color:#4841a9;
}



/*マージン*/





.mar_b_50{margin-bottom:50px;}

.bigText{font-size:200%}
.miniText{font-size:100%}
.miniText70{font-size:70%}

.blocksText,
a.blockText
{
	font-weight:800;
	font-size:100%;
	padding:5px 15px;;
	border:1px solid #4841a9;	 
	border-radius: 20px;  
	margin:20px 20px 20px 0;
}

.blocksText,
a.blockText
{
	color:#4841a9;
}
.blockText,
a.blocksText:hover
{
	background-color:#4841a9;
	color:#fff;
}





/*コンテンツ*/


#page_contents
{
	margin:auto;
	text-align: center;
	display		:block;
	padding-top:190px;
}
#root #page_contents,
#about #page_contents
{
	padding-top:120px;
}
#loc_list #page_contents
{
	padding-top:260px;
}
/*#root .mainVisual{ background-image:url(../img/20200523habaya/20200523habaya.15.jpg);}*/
		
.section 
{
    clear: both;
}


#page_tag .section h1 ,
#page_contents .section h1 
{
	color:rgb(118, 199, 191);
    padding: 50px 0;
    font-size: 200%;
}







/*セクション - メインビジュアル*/
.mainVisual,
.widePhoto
{
	width:100%;
	height:70vh;
	min-height:400px;
	background-color:#4841a9;
	background-image:url(../img/index/20191023sukima.forestmobile.8.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
	margin-bottom:100px;
}

.subVisual
{
	width:100%;
	height:50vh;

	background-color:#4841a9;
	background-image:url(../../cmn/img/about/cover2.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;

}
#root .subVisual
{
	height:30vh;
}


#about .mainVisual
{
	width:100%;
	min-height:600px;
	background-color:#4841a9;
	background-image:url(../../cmn/img/about/cover2.jpg);


}

#about .subVisual
{
	width:100%;
	height:50vh;
	min-height:400px;
	background-color:#4841a9;
	background-image:url(../../cmn/img/about/20191111censa.7.jpg);
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    margin-bottom:100px;
}

#design_detail .subVisual{
	width:100%;
	background-color:#4841a9;
	background-image:url("../../cmn/img/design/thumbnail/20181014sukima.3_thumb.jpg");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

#design_detail .thumbnailBox2 .item .cart_box{
	width: 80%;
}

#design_detail .thumbnailBox2 .item .cart_box img{
	width: 100%;
}

#design_detail .support{
	padding: 50px 0;
}














.mov-stage-min
{
    margin:10%;
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
}

.mov-stage 
{
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
    margin-bottom:100px;
}

.mov-stage iframe,
.mov-stage-min iframe 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



#page_contents .mainVisual
{
	height:70vh;
}

#tag_list #page_contents .mainVisual
{
	height:30vh;
	min-height:200px;
}

#page_contents .widePhoto
{
    height: 70vh;
    width: 100%;
    margin: 50px auto;
    max-width: 2500px;
}


#pges_tag .mainVisual
{
	height:20vh;
}



.mainVisualAndText
{
	margin:70px 0 100px;
	
}

.mainVisualAndText .item
{
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	justify-content	:space-between ;
	overflow:hidden;
	min-height:70vh;
	height:auto;
	
}
.mainVisualAndText .item .img
{
	background-color:#4841a9;
	background-size:cover;
	background-position:center center;
	width:60%;
}


.mainVisualAndText .item .txt
{
	color:#fff;
	font-size: 150%;
	background-color:#4841a9;
	width:30%;
	min-height:400px;
	padding:5%;

}

.mainVisualAndText .item .txt .inner
{
	margin-top:10vh;
}

.mainVisualAndText .item .txt h1
{
	text-align:left;
	color:#fff;
	font-size: 3rem;
	font-weight:400;
	padding:0;
}


.mainVisualAndText .item .txt p
{
	font-size: 120%;
	font-weight:40;
}



.user
{	
	display:block;
	float:right;
	 margin:0 0 20px 8px;  
	 z-index:1000;
}

.userIcon
{
	width:48px;
	height:48px;	
	display:block;
	float:right;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 50%; 
    -webkit-border-radius: 50%; 
    -moz-border-radius: 50%;
	top:-30px;
	/*margin-left:10px;*/
	/*border:2px solid rgb(118, 199, 191);*/
    border:1px solid rgba(0,0,0,0.1)
}

#pges_parmalink .user
{
	width: 80px;
	color:rgb(118, 199, 191);

}
#pges_parmalink .user p.text
{
	font-weight:800;
	width:100%;
	display:block;
	text-align: center;
}
#pges_parmalink .userIcon
{
	width:80px;
	height:80px;
	margin-bottom:10px;
}
#pges_parmalink .user p.tam:after{content:"たまき";}
#pges_parmalink .user p.yampuu:after{content:"ヤンプー";}
#pges_parmalink .user p.ito:after{content:"りん";}
#pges_parmalink .user p.kunishige:after{content:"くにしげ";}




.thumbnailBox7,
.thumbnailBox6,
.thumbnailBox5,
.thumbnailBox4,
.thumbnailBox3,
.thumbnailBox2,
.thumbnailBox1
{
	width 			:90%;
	max-width		:1200px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding			:0 0 50px 0;
}
.thumbnailBox7 .item{width		:13%;margin-bottom: 30px;}
.thumbnailBox6 .item{width		:17%;margin-bottom: 30px;}
.thumbnailBox5 .item{width		:20%;margin-bottom: 30px;}
.thumbnailBox4 .item{width		:25%;margin-bottom: 50px;}
.thumbnailBox3 .item{width		:33.333%;margin-bottom: 30px;}
.thumbnailBox2 .item{width		:50%;margin-bottom: 30px;}
.thumbnailBox1 .item{width		:100%;margin-bottom: 30px;}
.thumbnailBox7.thumbnailR .item{width		:13%;margin-bottom: 30px;   }
.thumbnailBox6.thumbnailR .item{width		:15%;margin-bottom: 30px;   }
.thumbnailBox5.thumbnailR .item{width		:18%;margin-bottom: 30px;   }
.thumbnailBox4.thumbnailR .item{width		:22%;margin-bottom: 50px;   }
.thumbnailBox3.thumbnailR .item{width		:30%;margin-bottom: 30px;   }
.thumbnailBox2.thumbnailR .item{width		:45%;margin-bottom: 30px;   }
.thumbnailBox1.thumbnailR .item{width		:100%;margin-bottom: 30px;  }

.thumbnailBox7.thumbnailR .item img,
.thumbnailBox6.thumbnailR .item img,
.thumbnailBox5.thumbnailR .item img,
.thumbnailBox4.thumbnailR .item img,
.thumbnailBox3.thumbnailR .item img,
.thumbnailBox2.thumbnailR .item img,
.thumbnailBox1.thumbnailR .item img
{
	border-radius: 10px;    
	overflow: hidden;
}

.thumbnailBox7.thumbnailR .item .img,
.thumbnailBox6.thumbnailR .item .img,
.thumbnailBox5.thumbnailR .item .img,
.thumbnailBox4.thumbnailR .item .img,
.thumbnailBox3.thumbnailR .item .img,
.thumbnailBox2.thumbnailR .item .img,
.thumbnailBox1.thumbnailR .item .img
{
	width		:100%;
	margin-bottom: 20px;
	padding:30% 0;
	background-size:cover;
	background-position:center center;
    border-radius: 10px;
    overflow:hidden;
}


#pges_parmalink .thumbnailR .userIcon
{
	width: 48px;
    height: 48px;
    margin-top: 24px;
}


.thumbnailBox7 .item,
.thumbnailBox6 .item,
.thumbnailBox5 .item,
.thumbnailBox4 .item,
.thumbnailBox3 .item,
.thumbnailBox2 .item,
.thumbnailBox1 .item
{
	margin-bottom: 30px;
}

.thumbnailBox7 .item img,
.thumbnailBox6 .item img,
.thumbnailBox5 .item img,
.thumbnailBox4 .item img,
.thumbnailBox3 .item img,
.thumbnailBox2 .item img,
.thumbnailBox1 .item img
{
	width		:100%;
	margin-bottom: 20px;
}

.thumbnailBox7 .item p,
.thumbnailBox6 .item p,
.thumbnailBox5 .item p,
.thumbnailBox4 .item p,
.thumbnailBox3 .item p,
.thumbnailBox2 .item p,
.thumbnailBox1 .item p
{
	font-size: 160%;
	text-align: left;
	margin:0 0 0 0;
}

.thumbnailBox7 .item p.subtext,
.thumbnailBox6 .item p.subtext,
.thumbnailBox5 .item p.subtext,
.thumbnailBox4 .item p.subtext,
.thumbnailBox3 .item p.subtext,
.thumbnailBox2 .item p.subtext,
.thumbnailBox1 .item p.subtext
{
	text-align: left;
	margin:0;
	font-size: 100%;
	padding:5% 10% 5% 0;
}

.thumbnailBox7 .item .productTitle,
.thumbnailBox6 .item .productTitle,
.thumbnailBox5 .item .productTitle,
.thumbnailBox4 .item .productTitle,
.thumbnailBox3 .item .productTitle,
.thumbnailBox2 .item .productTitle,
.thumbnailBox1 .item .productTitle
{
	font-weight:800;
    line-height: 100%;
	padding:5% 10% 5% 0;

}


.thumbnailBox7 .item:hover,
.thumbnailBox6 .item:hover,
.thumbnailBox5 .item:hover,
.thumbnailBox4 .item:hover,
.thumbnailBox3 .item:hover,
.thumbnailBox2 .item:hover,
.thumbnailBox1 .item:hover,
{
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
    border-radius: 10px;
    border:1px solid rgba(0,0,0,0.1)
}
/*
.thumbnailBox7 .item:hover .img,
.thumbnailBox6 .item:hover .img,
.thumbnailBox5 .item:hover .img,
.thumbnailBox4 .item:hover .img,
.thumbnailBox3 .item:hover .img,
.thumbnailBox2 .item:hover .img,
.thumbnailBox1 .item:hover .img
{
    border-radius: 10px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}	
.thumbnailBox7 .item .txt,
.thumbnailBox6 .item .txt,
.thumbnailBox5 .item .txt,
.thumbnailBox4 .item .txt,
.thumbnailBox3 .item .txt,
.thumbnailBox2 .item .txt,
.thumbnailBox1 .item .txt
{
	transition: 0.5s;
}	


.thumbnailBox7 .item:hover .txt,
.thumbnailBox6 .item:hover .txt,
.thumbnailBox5 .item:hover .txt,
.thumbnailBox4 .item:hover .txt,
.thumbnailBox3 .item:hover .txt,
.thumbnailBox2 .item:hover .txt,
.thumbnailBox1 .item:hover .txt
{
	padding:0 20px;
}	
*/












.thumbnailBox3and2
{
	width 			:90%;
	max-width		:1600px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding		:0 0 50px 0;
}


.thumbnailBox3and2 .item
{
    border:1px solid rgba(0,0,0,0);
    transition: none;
}
.thumbnailBox3and2 .item p
{
	width:90%;
	overflow:hidden;
	transition: 0.5s;
}
.thumbnailBox3and2 .item .txt
{
	transition: 0.5s;
}
.thumbnailBox3and2 .item .img
{
    border-radius: 10px;
    transition: none;
}
.thumbnailBox3and2 .item .user
{
	padding-right:0px;
	transition: 0.5s;
}
.thumbnailBox3and2 .item#about .user
{
	padding-right:0px;
}
.thumbnailBox3and2 .item#about:hover  .user
{
	padding-right:0px;
}
.thumbnailBox3and2 .item p.subtext
{
	padding:0;
	position: absolute;
	width:200px;
}

.thumbnailBox3and2 .item:hover
{
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
    border-radius: 10px;
    border:1px solid rgba(0,0,0,0.1)
}

.thumbnailBox3and2 .item:hover .img
{
    border-radius: 10px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
}
.thumbnailBox3and2 .item:hover .user
{
	padding-right:20px;
}
.thumbnailBox3and2 .item:hover .txt
{
	padding:0 0 0 20px;
}
.thumbnailBox3and2 .item:hover p
{	
	/*width:91%;*/
}	
.thumbnailBox3and2 .item:hover p.subtext
{	
	padding:0 20px 0 0;
}






.thumbnailBox3and2 .item
{
	width		:30%;
	margin-bottom: 100px;

}
.thumbnailBox3and2 .item .img
{
	padding:20% 0;
	background-size:cover;
	background-position:center center;
	border-radius: 10px; 
	-webkit-border-radius: 10px; 
	-moz-border-radius: 10px;
	overflow: hidden;
}
.thumbnailBox3and2 .item:nth-child(9n+1),
.thumbnailBox3and2 .item:nth-child(9n+2) 
{
	width		:47%;
	margin-bottom: 80px;
   
}
.thumbnailBox3and2 .item:nth-child(9n+2),
.thumbnailBox3and2 .item:nth-child(9n+4),
.thumbnailBox3and2 .item:nth-child(9n+7) 
{
	top:60px;
	position:relative;
}
.thumbnailBox3and2 .item:nth-child(9n+5),
.thumbnailBox3and2 .item:nth-child(9n+8) 
{
	top:90px;
	position:relative;
}
.thumbnailBox3and2 .item:nth-child(9n+9) 
{
	top:120px;
	position:relative;
}

.thumbnailBox3and2 .item:nth-child(9n+6),
.thumbnailBox3and2 .item:nth-child(9n+7), 
.thumbnailBox3and2 .item:nth-child(9n+8),
.thumbnailBox3and2 .item:nth-child(9n+9) 
{
	width		:21%;
	margin-bottom: 120px;
   
}

.thumbnailBox3and2 .item .img
{
	width		:100%;
	margin-bottom: 20px;

}

.thumbnailBox3and2 .item .productTitle
{
	margin:10px 0;
	height: 6rem;
}

.thumbnailBox3and2 .item p
{
	color:#4841a9;
	font-weight:800;
	font-size: 160%;
	line-height:1.2;
	text-align: left;
	margin:0 0 0 0;
}

.thumbnailBox3and2 .item p.subtext
{
	text-align: left;
	margin:0;
	font-size: 100%;
	/*padding:5% 10% 5% 0;*/
	height: 4rem;
	z-index:-10;
}








.thumbnailBox3ItemWide
{
	width		:66%;
	margin-bottom:30px;
}

.thumbnailBox3ItemWide img
{
	width		:100%;
	 border-radius: 2px; 
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px;  
}
.thumbnailBox3ItemWideText
{
	width		:30%;	
}
.thumbnailBox3ItemWideText h2
{
	margin :0;
	padding:0;
    font-weight: 900;
}
.thumbnailBox3ItemWideSub
{
	width		:32%;
	margin-bottom: 10px;
}
.thumbnailBox3ItemWideSubImg
{
	width		:100%;
	margin-bottom: 4%;
}
.thumbnailBox3ItemWideSubImg img
{	
	width		:100%;
	 border-radius: 2px; 
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px;  

}






#tagList
{
	margin-bottom:50px;
	display: block;
    float: left;
}

#tagList .item
{
	margin-right:30px;
	display:block;
	float:left;
	width:auto;
}

.entry .thumbnailBox2{
	padding: 0;
	margin-bottom: 0;
}

#matchNavi .item,
#matchEntry .item,
#matchTown .item
{
	display:none;
}







#subphoto{
	width: 100%;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-top: 5px;
}

.thumbnailBox2 #subphoto .item
{
	width		:49%;
   margin-bottom: 0;
}

.thumbnailBox2 #subphoto .item img
{
   margin-bottom: 0;
}

.thumbnailIsland .item img
{
	border-bottom:1px solid rgba(0,0,0,0.1);
}


.thumbnailIsland .item:hover
{
	border:1px solid rgba(0,0,0,0.2);	
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
}


.thumbnailIsland .item
{

	border:1px solid rgba(0,0,0,0.1);
	border-radius: 10px ;
	overflow:hidden;
}

.thumbnailIsland .item p.productTitle,
.thumbnailIsland .item p.subtext
{
	padding-left:10%;
	padding-right:10%;
}
.thumbnailBox4.thumbnailIsland .item{width:24%;}
.thumbnailBox3.thumbnailIsland .item{width:30%;}
.thumbnailBox2.thumbnailIsland .item{width:48%;}
.thumbnailBox1.thumbnailIsland .item{width:100%;}



.thumbnailCard .item
{

	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	justify-content	:flex-start ;
	min-height:160px;
	border:1px solid rgba(0,0,0,0.1);
	border-radius: 10px ;
	max-height:160px;
	overflow:hidden;
}


.thumbnailCard .item .img
{
	background-color: #eee;
	background-size:cover;
	background-position:center center;
	width:35%;
	height:auto;
	max-height:160px;
	border-right:1px solid rgba(0,0,0,0.1);
}

.thumbnailCard .item:hover
{
	border:1px solid rgba(0,0,0,0.2);	
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
}


.thumbnailCard .item .txt
{
	width:70%;
	padding:24px 24px;
	max-height: 160px;
}
.thumbnailCard .item p.productTitle,
.thumbnailCard .item p.subtext
{
	text-align:left;
	line-height:120%;
}
.thumbnailBox4.thumbnailCard .item{width:24%;}
.thumbnailBox3.thumbnailCard .item{width:30%;}
.thumbnailBox2.thumbnailCard .item{width:48%;}
.thumbnailBox1.thumbnailCard .item{width:100%;}

.tableBox
{
	width 			:90%;
	max-width		:1200px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding			:0 0 50px 0;
	clear: both;
}

.tableBox .item 
{
    width: 45%;
}


a.link 
{
	text-decoration: underline;
}

.iconCard
{
	max-width		:1200px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin			:0;
	padding			:0 0 50px 0;
	font-weight		:800;
}




.iconCard .item
{

	min-height:70px;
	border:0px;
	width:70px;
	margin-right: -5px;
}
.iconCard .item .img
{
	background-color: #eee;
	background-size:cover;
	background-position:center center;
	width:70px;
	height:70px;
	min-width:70px;
	min-height:70px;
	/*border:1px solid rgba(255,255,255,1);*/

}
.iconCard .item .productTitle
{

}

.iconCard .item p.subtext
{
	font-size:80%;
	padding:0;
	color:#fff;
	text-align: center;
}





.thumbnailCard .item p.subtext
{
	color:#ffffff;
}






/*セクション - 使い方*/




.detail
{

	width 			:100%;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding			:0 0 30px 0;
}






/*セクション - アプリ課金比較/ダウンロード*/


.application
{

	width 			:90%;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding			:0 0 50px 0;
	max-width		:1000px;
}

.applicationItem
{
  	display		:block;
	width		:48%;
	margin-bottom: 50px;
   	 border-radius: 2px; 
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px;  
}
.applicationItem img
{
	width		:100%;
	margin-bottom: 0px;

}






/*セクション - よくあるご質問*/


.faq
{
	margin:0;

	width:100%;
}

.faqItem
{
	margin: 0 auto; 
	max-width:1000px;
	border:1px solid #dddddd;
	background-color:#fff;
	margin-bottom:20px;
	border-radius: 2px;
    -webkit-border-radius: 2px; 
    -moz-border-radius: 2px;  
	text-align	:left;
	overflow: hidden;
}



.faqItemQ{
	background-color:#f0f0f0;
	background-size:50px ;
    background-repeat: no-repeat;
    background-position: left 10px center;
	background-image:url(../img/index/q.svg);
	/*border-bottom:1px solid #dddddd;*/
	padding:20px 8px 20px 64px;

	cursor: pointer;
}

.faqItemQ span{
	background:url(../img/index/icon_down.svg) no-repeat 98% 50%;
	background-size: 12px 7px;
	display: block;
	padding-right: 22px;
}
.faqItemQ.active span{
	background:url(../img/index/icon_up.svg) no-repeat 98% 50%;
	background-size: 12px 7px;
	display: block;
}




.faqItemA
{
	display: none;/*20180326*/
	background-size:50px ;
    background-repeat: no-repeat;
    background-position: 8px center;
	background-image:url(../img/index/a.svg);
	padding:20px 12px 20px 64px;
}






/*セクション - 運営*/


#contact
{
	background-color:#f0f0f0;
	width:100%;
	padding:40px 0 40px 0;  

}

#contact .contactItem
{
	width:80%;
	margin:0 auto;
}

#contact .contactItem ul
{


	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;	
}


#contact .contactItem ul li
{
	text-align	:center;
	margin		:0;
	list-style	:none;
	flex-basis		:25%;
	border-right:1px solid #dddddd;
}


#contact .contactItem ul li a
{
	padding-top	:40px;
	height		:30px;
	text-decoration: none;
}


#contact .contactItem ul li a:hover
{
	text-decoration: underline;
}





.mov 
{
    position: relative;
    padding-top: 56.25%;
    overflow: hidden;
}

.mov iframe 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}










#topics
{

	
	width:100%;
	max-width:1200px;
	display:block;
	float: left;
	margin:10px 0 50px 0;
}

#topics h2
{
	padding-top: 100px;
	padding-left:0px;
	font-size:180%;
}
#info_topics_permalink p.txt
{
	font-size:140%;
	line-height:200%;
}

.detail_box{
	width 			:90%;
	max-width		:1200px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:wrap;
	justify-content	:space-between;
	margin-bottom	:100px;
	margin:0 auto;
	padding			:0 0 50px 0;
	margin-top: 160px;
}

.detail_box .entry{
	width		:60%;
	margin-bottom: 30px;
}

.detail_box .entry img{
	width		:100%;
	border-radius: 10px ;
}

.detail_box .entry .productTitle{
	font-size: 160%;
}




#sidebar{
	width 			:35%;
	margin-bottom	:100px;
	padding			:0 0 50px 0;
}

#sidebar .item
{
	width: 100%;
	height: auto;
	margin-bottom: 30px;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	min-height:100px;
	border:1px solid rgba(0,0,0,0.1);
	border-radius: 10px ;
	max-height:160px;
	overflow:hidden;
}

#sidebar .item .img
{
	background-color: #eee;
	background-size:cover;
	background-position:center center;
	width:25%;
	height:auto;
	max-height:160px;
	border-right:1px solid rgba(0,0,0,0.1);
}

#sidebar .item .txt{
	width: 70%;
    padding: 24px 24px;
    max-height: 160px;
}

#sidebar .item .productTitle{
	font-size: 120%;
	line-height: 120%;
	margin: 0;
}

#sidebar .item .subtext{
	margin-bottom: 0;
}

.footer
{
	text-align:center;
}

.footer .copyrights
{
	text-align:center;
	margin:100px auto;
	font-size:80%;
}



#main img
{  
	display:block;
	float: left;
}  



h1
{	
	text-align:center;
	padding: 200px 0 200px 0;
	font-size: 300%;
	line-height: 1;
}


h2
{
	width:100%;
	line-height:1.8rem;
	color:#4841a9;
	text-align:left;
	padding: 20px 0 20px 0;
	font-size: 200%;
}


p
{
	font-size: 100%;
	text-align: left;
	line-height: 1.8;
	margin-bottom:50px
}

.clear 
{
	clear:both;
}

.logo
{
	width:208;
	margin: 0 auto;  

}


.table1
{

	border-top : 1px solid #dddddd;
	width:100%;
	font-weight: normal;
	font-size: 120%;
	margin: 50px 0 50px 0;
	text-align : left;
	margin: 0 auto;
}

.table1 th
{
	padding: 0px; 
	border-bottom : 1px solid #dddddd;
	width : 12%;
}
.table1 th.year
{
	width : 10%;
}
.tableBox .table1 th 
{
	width : 4%;
}
.table1 td.subtext
{
	font-size:90%;
	width : 15%;
}

.table1 td
{
	padding: 30px 0 30px 0 ;
	border-bottom : 1px solid #dddddd;

}
.table1 .area
{
	width : 20%;
}












.bg_gray
{
	background-color:f7f7f7;
}

.sectioin
{
	/*text-align: center; */
	/*width 			:100%;*/
}

.item{
	/*
	margin: 0 auto;
	*/
}

.subtext
{  
	color: #4841a9;
} 





.btn 
{
	display : block;
	
	margin-bottom:100px;
}
.btn a
{
	-webkit-border-radius: 4;
	-moz-border-radius: 4;
	border-radius: 4px;
	color: ##4841a9;

	background: #ffffff;
	padding: 20px 0px 20px 0px;
	border: solid ##4841a9 1px;
	text-decoration: none;
	text-align:center;
	width:100%;
	margin:0 auto;
	display:block;
	float:center;
	margin-bottom: 20px;
}
.btn a:hover 
{

	background: ##4841a9;
	color: #ffffff;
	text-decoration: none;
}

.btn_w 
{
	display : block;
	
	margin-bottom:100px;
}
.btn_w a
{
	-webkit-border-radius: 4;
	-moz-border-radius: 4;
	border-radius: 4px;
	color: #ffffff;

	background:rgb(118, 199, 191);
	padding: 20px 0px 20px 0px;
	border: solid #ffffff 1px;
	text-decoration: none;
	text-align:center;
	width:100%;
	margin:0 auto;
	display:block;
	float:center;
	margin-bottom: 20px;
}
.btn_w a:hover 
{

	background: #ffffff;
	color: rgb(118, 199, 191);
	text-decoration: none;
}


.btn_b
{
	display : block;
	box-shadow: 10px 10px 50px rgba(0,0,0,0.05);
	margin-bottom:30px;
}
.btn_b a
{
	-webkit-border-radius: 4;
	-moz-border-radius: 4;
	border-radius: 4px;
	color: #ffffff;
	border: solid rgb(118, 199, 191) 1px;
	background: rgb(118, 199, 191);
	padding: 20px 0px 20px 0px;
	font-size:1.2rem;
	font-weight:600;
	text-decoration: none;
	text-align:center;
	width:100%;
	margin:0 auto;
	display:block;
	float:center;
	margin-bottom: 20px;
}
.btn_b a:hover 
{
	border: solid rgba(0, 43, 122 ,0.2) 1px;
	background: #ffffff;
	color: rgb(118, 199, 191);
	text-decoration: none;

}



.minText
{
	font-size: 70%;
	opacity:0.6;
}





.download_a
{
	 opacity:0.3;
}


a.underline
{
	text-decoration:underline;
}






.wideMovBox
{	
	max-width:1400px;
	width 			:90%;
	display			:flex;
	-js-display		:flex;
	flex-wrap		:nowrap;
	justify-content	:space-between;
	padding:0;
	margin:0 auto 100px;
}

.wideMovBoxTxt
{
	width		:70%;
	color:#fff;
	background-color:#f3baab;
	top: -350px;
    left: -50px;
    position: relative;
    z-index: inherit;
   	padding:1% 5%;
}



.wideMovBox .wideMovBoxTxt h2.txt
{
	color:#fff;
	font-size:3rem;
	line-height:140%;
	width:100%;
	font-weight:800;

}
.wideMovBox .wideMovBoxTxt  p.txt
{
	color:#fff;
	font-size:1.2rem;
	line-height:220%;
	width:100%;
	font-weight:800;

}
.wideMovBox .wideMovBoxTxt  a
{
	color:#fff;
	font-size:1.2rem;
	line-height:220%;
	width:100%;
	font-weight:800;

}


.wideMovBox .mov-stage 
{
	width: 70%;
    position: relative;
    padding-top: 39.375%;/*56.25%;*/
    overflow: hidden;
    background-color:#666;
}

.wideMovBox .mov-stage iframe 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.wideTxtBox
{
	width:			90%;
	max-width			:1000px;
	padding:0;
	text-align:left;
	margin:100px auto;
}

.wideTxtBox h1
{
	text-align:left;
	width			:100%;
	padding			:0;
	text-align		:left;
	line-height		:140%;
}

.wideTxtBox .subtext
{
	font-size:120%;
}





#pges_parmalink .wideMovBox .wideMovBoxTxt
{
	background-color:#fff;
	top: 0;
    left: 0;
    padding:0 80px;
    margin:0;
    top:0;
}
#pges_parmalink .wideMovBox .wideMovBoxTxt h2.txt,
#pges_parmalink .wideMovBox .wideMovBoxTxt p.txt
{
	color:#4841a9;
	margin:0 0 50px;
	padding:0;
}

#pges_parmalink .wideMovBox.first
{
	max-width:2000px;
	width:100%;
}

#pges_parmalink .productTitle
{
	padding:0;
}
#pges_parmalink .subtext
{
	color:#4841a9;
}

#root .wideMovBoxTxt
{
	margin-bottom:-350px;
}




.item p.center
{
	margin:auto; 
}


.accessmap
{
	padding:0 10%;
	width:80%;
	height:50vh;
	filter:grayscale(100%);
}
.accessmap iframe
{
	/*filter: invert(100%);*/
}

.mainVisualTextBox
{
	width		:75%;
	color:#4841a9;
	background-color:#fff;
	top: -150px;
    position: relative;
    z-index: inherit;
   	padding:5% 5% 0 10%;
   	margin-bottom: -50px;
}

.mainVisualTextBox .txt h1
{
	font-size:400%;
	text-align:left;
	padding: 0;
	margin: 30px 0 10px;
}

.mainVisualTextBox .txt p
{
	text-align:left;
	padding: 0;
	margin: 20px 0;
}


.url
{
	max-width:100px;
 white-space: nowrap;  
 overflow: hidden;  
 text-overflow: ellipsis;  
 -webkit-text-overflow: ellipsis;  
 -o-text-overflow: ellipsis;  
}  



#root  .thumbnailBox3and2 
{
	padding: 40px 0 50px 0;
}
#root .thumbnailBox3and2 .item:nth-child(2)
{
	top:0;
	width:65%;
	order:-2;
}
#root .thumbnailBox3and2 .item:nth-child(1)
{
	background-color:#f3baab; 
	width:30%;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	order:-1;
}
#root .thumbnailBox3and2 .item:nth-child(1) h1
{
	color:#ffffff;
	text-align:left;
	font-size: 3rem;
    padding: 0 0 20px 0;
}

#root .thumbnailBox3and2 .item:nth-child(1) p
{
	color:#ffffff;
	text-align:left;
	font-size: 1rem;
	line-height:1.8;
	width:100%;
	margin-bottom: 30px;
}
#root .thumbnailBox3and2 .item:nth-child(1) .user_inner 
{
	width:20%;
	float:left;
}

#root .thumbnailBox3and2 .item:nth-child(1) .user
{
    margin: 0;	
}
#root .thumbnailBox3and2 .item:nth-child(1) .user p.text
{
    text-align: center;
    width: 100;
    font-size:0.8rem;
}

#root .thumbnailBox3and2 .item:nth-child(1) .userIcon
{
	float:left;
    margin: 0;
	width:90px;
	height:90px;
}
#root .thumbnailBox3and2 .item:nth-child(1) .text
{
	text-align: center;
}
#root .thumbnailBox3and2 .item:nth-child(1) .inner
{
	padding: 10% 5% 10% 10%;
}


#root .thumbnailBox3and2 .item:nth-child(2) .img
{
	height: 100px;	
}





@media (max-width: 1500px) 
{
	#root .thumbnailBox3and2 .item:nth-child(1) h1{    font-size: 2.3rem;}
	.wideMovBox .wideMovBoxTxt h2.txt{font-size:1.8rem;}
	.wideMovBox .wideMovBoxTxt p.txt{font-size:1rem;}	 
}

@media (max-width: 1200px) 
{
	#root .thumbnailBox3and2 .item:nth-child(1) h1{    font-size: 2.0rem;}
	 /*.thumbnailBox3{width		:1200px;}*/
}

@media (max-width:1100px)
{
	.conceptItem{background-size:1100px;}
	#root .thumbnailBox3and2 .item:nth-child(1){width:40%;}
	#root .thumbnailBox3and2 .item:nth-child(2){width:55%;}
	#root .thumbnailBox3and2 .item:nth-child(2) .productTitle{font-size: 160%;}
	#root .thumbnailBox3and2 .item:nth-child(2) .img{height: 200px;	}
}
@media (min-width: 1100px) 
{
	#root .thumbnailBox3and2 .item:nth-child(2) .productTitle
	{
		font-size: 220%;
		height: auto;
	}
}


    
@media (max-width: 1000px) 
{

	#root .thumbnailBox3and2 .item:nth-child(1) h1  {font-size: 2.0rem;}
	#root .thumbnailBox3and2 .item:nth-child(2) .img{height: 200px;}

	.mainVisualAndText{margin-bottom:50px;}
	.mainVisualAndText,
	.mainVisualAndText .item,
	.mainVisualAndText .item .img,
	.mainVisualAndText .item .txt {min-height:600px;height:600px;}
	.mainVisualAndText .item .img,
	.mainVisualAndText .item .txt {width:50%}
	.mainVisualAndText .item .txt .inner{margin-top:30px;}
	.wideMovBox{	width 			:90%;	flex-wrap		:wrap;margin:0 auto 100px;}
	.wideMovBox .subVisual{	height	:50vh;}	
	.wideMovBoxTxt{width:90%; padding:1% 5% 1% 10%;top: 0;}

	/*#root .wideMovBoxTxt{width:90%; padding:1% 5% 1% 10%;	top: -150px; margin-bottom:-150px;}*/
	#root .wideMovBoxTxt{ margin-bottom:50px;}
	.wideMovBox .subVisual{margin-bottom:50px;}
	.wideMovBox .mov-stage{width:90%;	padding-top:50.625%;}

	.thumbnailBox3 .item{width		:50%;}
	.thumbnailBox4 .item{width		:50%;}
	.thumbnailBox5 .item{width		:50%;}
	.thumbnailBox3ItemWide{width	:100%}
	.thumbnailBox3ItemWideText{width	:100%}
	.thumbnailBox3ItemWideText h2{margin-top:50px}
	.thumbnailBox3ItemWideSub{width:100%;display: flex;justify-content: space-between;}
	.thumbnailBox3ItemWideSubImg{width:48%;}
	.thumbnailBox1.thumbnailIsland .item{width:100%;}
	.thumbnailBox2.thumbnailIsland .item{width:48%;}	
	.thumbnailBox3.thumbnailIsland .item{width:48%;}	
	.thumbnailBox4.thumbnailIsland .item{width:48%;}	
	.thumbnailBox5.thumbnailIsland .item{width:48%;}
	.tableBox .item{width:100%;}
	.faqItem{max-width:80%;}
}

@media (max-width: 900px) 
{
	#root .thumbnailBox3and2 .item:nth-child(1) .user_inner {width:50%;	}
	#root .thumbnailBox3and2 .item:nth-child(1) .user p.text {margin-bottom: 10px;}
	#root .thumbnailBox3and2 .item:nth-child(2) .img{height: 300px;	}
}



@media (max-width: 746px) 
{
	#root .thumbnailBox3and2 .item:nth-child(2) .productTitle
	{

	    height: auto;
	}

	#root .thumbnailBox3and2 .item:nth-child(2) .img
	{
		height: 80px;	
	}
	
	body
	{
		width:100%;
		font-size:80%;
	}
	#navi li a{    padding: 15px 0 15px 0; height: 80px;font-size:70%; }
	#navi li.takeout{letter-spacing:-1px;}
	#navi li.contents.home{ display: inline;}
	#navi li.contents img{   height: 60%; max-width:80%;padding-bottom:10px;}

	#navi li.contents.home img{   width: 100px;}
	#navi li.logo{display:none;}
	#navi li.contents.about{display:none;}
		
	#navi li.tw{display:none;}
	#navi li.ig{display:none;}
	#navi li.fb{display:none;}
	#navi {height:100px;	flex-wrap:wrap;}
	#navi li		{flex-basis:18%;}
	#navi li.home	{flex-basis:28%;}
	#navi li{text-align:center;}
	#navi li.logo.sp 
	{
		width:100%;
    	display: flex;
   		text-align:left;
	}

	#navi li.logo img	{max-height:100px;}
	#navi li.logo.sp img{width:100%;}
	#navi li.logo.sp{display:none;} 
	#navi li.tw.sp{display:none;} /*{display:flex;}*/
	#navi li.ig.sp{display:none;} /*{display:flex;}*/
	#navi li.fb.sp{display:none;} /*{display:flex;}*/
	#navi_sub,#navi_sub_sub{top:110px;position:relative;margin:0; }
	#navi_sub ul li a,#navi_sub_sub ul li a{font-size: 80%;}
	
	

	#loc_list #navi_sub_sub ul
	{
		width 			:100%;
		min-width: 100%;
	}
	#loc_list #navi_sub_sub.hiroshima ul	{min-width: 2000px;}
	#loc_list #navi_sub_sub.tokyo ul		{min-width: 700px;}





	#page_contents{padding:100px 0 100px 0 ;}
	#loc_list #page_contents{padding-top:100px;}
	.thumbnailBox3and2 .item{width:100%;}
	.thumbnailBox3and2 .item:nth-child(9n+1),
	.thumbnailBox3and2 .item:nth-child(9n+2),
	.thumbnailBox3and2 .item:nth-child(9n+3),
	.thumbnailBox3and2 .item:nth-child(9n+4),
	.thumbnailBox3and2 .item:nth-child(9n+5),
	.thumbnailBox3and2 .item:nth-child(9n+6),
	.thumbnailBox3and2 .item:nth-child(9n+7),
	.thumbnailBox3and2 .item:nth-child(9n+8),
	.thumbnailBox3and2 .item:nth-child(9n+9){width:100%;margin-bottom: 20px;top:0;}
	.thumbnailBox3and2 .item .productTitle{height:auto}
	.thumbnailBox3and2 .item p{width: 100%;}
	.thumbnailBox3and2 .item .userIcon{width: 32px;height: 32px;}

	.thumbnailBox3 .item .productTitle,
	.thumbnailBox4 .item .productTitle{font-size: 140%;line-height:120%;}
		
	.mov-stage {margin-top: 144px;}
	.thumbnailBox2 .item{width		:100%;}	
	.thumbnailBox3 .item{width		:50%;}
	.thumbnailBox4 .item{width		:50%;}
	.thumbnailBox5 .item{width		:50%;}
	.thumbnailBox3 .item p.subtext{padding10%;line-height: 100%;}
	.thumbnailBox4 .item p.subtext{padding10%;line-height: 100%;}
	.thumbnailBox7.thumbnailR .item{width		:45%}
	.thumbnailBox5.thumbnailR .item{width		:45%; }
	.thumbnailBox4.thumbnailR .item{width		:45%; }
	.thumbnailBox3.thumbnailR .item{width		:45%; }
	.thumbnailBox2.thumbnailR .item{width		:45%; }
	.thumbnailBox1.thumbnailR .item{width		:100%;}
	.thumbnailR .userIcon{width: 32px;height: 32px;margin-top:20px}
	
	.detail{width		:100%;}
	.thumbnailBox3ItemWide{width	:100%}
	.thumbnailBox3ItemWideText{width	:100%}
	.thumbnailBox3ItemWideText h2{margin-top:50px}
	.thumbnailBox3ItemWideSub{width:100%;display: flex;justify-content: space-between;}
	.thumbnailBox3ItemWideSubImg{width:48%;}
	.thumbnailCard .item .img{max-height: 160px;}
	.thumbnailBox2.thumbnailCard .item{width:100%;max-height: 160px;}
	.thumbnailBox3.thumbnailCard .item{width:100%;max-height: 160px;}
	.thumbnailBox4.thumbnailCard .item{width:100%;max-height: 160px;}
	.thumbnailBox5.thumbnailCard .item{width:100%;max-height: 160px;}

	
	.detail_box.entry{
		width: 100%;
	}
	
	#sidebar{
		width: 100%;
	}

	#sidebar .item{
		width: 100%;
		margin: 0 auto;
		margin-bottom: 30px;
	}
	#root #page_contents,
	#about #page_contents
	{
		padding-top:100px;
	}
	
	
	
	.faqItem{max-width:80%;}
	.applicationItem{width:100%;}
	.conceptItem{background-size:cover;}
	.conceptItem.conceptItem1{background-image:url(../img/index/sp_c1.png);}
	.conceptItem.conceptItem2{background-image:url(../img/index/sp_c2.png);}
	.conceptItem.conceptItem3{background-image:url(../img/index/sp_c3.png);}
	.conceptItem.conceptItem4{background-image:url(../img/index/sp_c4.png);}
	.mainVisualAndText {margin-top:0;width:100%;height:600px;min-height:600px;}
	.mainVisualAndText .item {flex-wrap		:wrap;height:600px;min-height:600px;}
	.mainVisualAndText .item .img{width		:100%;height:300px;min-height:300px;}
	.mainVisualAndText .item .txt{width		:100%;height:300px;min-height:300px;}
	.mainVisualAndText .item .txt h1{padding :0;margin :0;}
	.wideMovBoxTxt{width:90%; padding:1% 8% 1% 18%; top: -100px; }
	.wideMovBoxTxt .first{width:90%;}
	#root .wideMovBox .subVisual{display:none;width:90%; height:50vh; margin:0 auto 100px;}
	//*#root .mainVisual{background-image:url(../img/ogp2.jpg);}*/


	#page_contents{width:100%;font-size:80%;}
	.thumbnailBox3and2 .item p.subtext{font-size:120%;}
	
	.mainVisualTextBox
	{
		    top: 0px;
		    width: 90%;
		    margin-bottom:50px;
		    padding: 0 5% 0 5%;
	}
	#page_contents .mainVisual
	{
		margin-bottom:30px;
		margin:0 0 20px;
		width:100%;
		height:50vh;
		min-height:200px;
	}
	.mainVisualTextBox .txt h1
	{
		font-size:240%;
	}
	#pges_parmalink .user
	{
		width: 64px;
		margin: 0;
		padding: 0;
	}
	
	#pges_parmalink .userIcon 
	{
		
	    width:  50px;
	    height: 50px;
	    margin: 6px;
    }	
    #pges_parmalink .thumbnailR .userIcon
	{
		width: 32px;
	    height: 32px;
	    margin-top: 12px;
	}

	#pges_parmalink .item.user.userIcon 
	{
	    width: 32px;
	    height: 32px;
    }
    
	#pges_parmalink .mainVisualTextBox.userIcon 
	{
	    width: 60px;
	    height: 60px;
    }
    
    #root .wideMovBox 
    {
    	 margin-bottom: -100px;
	}
	
    #pges_parmalink .wideMovBox 
    {
    	 margin-bottom: 10px;
	}

	#pges_parmalink .wideMovBox .wideMovBoxTxt 
	{
		padding: 0 30px;
	}
	
	#pges_parmalink .wideMovBox.first
	{
		width:90%;
		margin-bottom: 10px;
	}

	.blocksText 
	{
    	font-weight: 600;
		display: inline-flex;
	    margin: 5px 5px 5px 0;
	    font-size: 80%;
    	padding: 3px 10px;
	}

	
	.detail_box .entry{width		:100%;}	
	.thumbnailBox3and2 .item .img{padding:15% 0;}
	#root .thumbnailBox3and2 .item:nth-child(1){order:0}
	#root .thumbnailBox3and2 .item:nth-child(2){order:-2}
	#root .thumbnailBox3and2 .item:nth-child(3){order:-1}
	{
		width:100%;		
	}
	#root .thumbnailBox3and2 .item:nth-child(1),
	#root .thumbnailBox3and2 .item:nth-child(2)
	{
		width:100%;		
	}
	#root .thumbnailBox3and2 .item:nth-child(1) h1
	{
		margin:0;
	}
	#root .thumbnailBox3and2 .item:nth-child(1) .user
	{
		margin:0;
	}
	#root .thumbnailBox3and2 .item:nth-child(1) .userIcon
	{
		width: 80px;
    	height: 80px;
    	margin: 0 10px 10px 0;
	}
	#root .thumbnailBox3and2 .item:nth-child(1) .user_inner 
	{
    	width: 23%;
	}
	
	@media screen and (orientation: landscape) 
	{

		#navi,
		#navi_sub,
		#navi_sub_sub,
		{
			position: static;
			
		}
		#navi
		{
			border-bottom:10px solid #f0f0f0;
		}
		#page_contents 
		{
		    padding: 0 0 0 0;
		}
		
	}

	.thumbnailBox3and2 .item,
	.thumbnailBox3and2 .item p,
	.thumbnailBox3and2 .item .txt,
	.thumbnailBox3and2 .item .img,
	.thumbnailBox3and2 .item .user
	{
		transition: none ;
	}

}


@media (max-width: 527px) 
{
	#navi{width:100%;height:110px;};
	body{min-width:100%;}
	.thumbnailBox3 .item{width		:50%;}
	.conceptItem{background-size:contain;}


}


@media (max-width: 551px) 
{
	#navi li.ig.sp img,
	#navi li.fb.sp img,
	#navi li.tw.sp img
	{
		width:100%;
	}
}






