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


#mainImageBox {
	width:  740px;
	margin-top: 20px;
	float: left;
	text-align:center;
}
#mainImageBox  p#title {
	margin-bottom: 10px;
}
#mainImageBox #linkFree {
	margin-top:1em;
}



#menuBox {
	width:  430px;
	float: right;
}
#menuBox #lineStampWrap {
	margin-bottom: 20px;
	text-align:center;
}

#menuBox #lineStampWrap a#lineStamp {
	display:block;
	background-color: #47C906;
	marginbottom: 20px;
}


#menuBox #newBox {
	margin-top:   10px;
	padding-top: 10px;
	margin-bottom:15px;
}
#menuBox #newBox #titleNew {
	font-size: 14px;
	color:#E62528;
	margin-bottom:10px;
	padding-bottom: 2px;
	border-bottom: solid 1px #000000;
}
#menuBox #newBox ul,
#menuBox #newBox ul li {
	margin:0;
	padding:0;
}
#menuBox #newBox ul {
	margin: 0 0 0 1.5em;
}
#menuBox #newBox ul li {
	margin:4px 0;
}
#menuBox #newBox ul li a:link, 
#menuBox #newBox ul li a:visited {
	color:#000;
	font-size: 13px;
}





#menuBox #twitterBox {
	width:  100%;
	padding: 0;
	margin-top: 7px;
}
#menuBox #twitterBox #twitterCOPICtwindlogo {
	text-align: right;
}

#menuBox #mainMenuBoxWrap ul,
#menuBox #mainMenuBoxWrap li {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height:1px;
}
#menuBox #mainMenuBoxWrap #mainMenuBox p#mainLink {
}
#menuBox #mainMenuBoxWrap #mainMenuBox p#mainLink img:hover {
	margin-top: 5px;
	margin-bottom: -5px;
}

#menuBox #mainMenuBox #mainLink {
	background-image: url(https://copic.jp/twins/common/images/title_btn_bg.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	text-align:center
}

#menuBox  #mainMenuBoxWrap #mainMenuBox #subLink {
	margin-top: 2px;
	background-color: #0DB800;
	text-align:center;
}


#menuBox #mainMenuBoxWrap ul#subLink2 {
	margin-top: 10px;
	margin-bottom:10px;
}
#menuBox #mainMenuBoxWrap ul#subLink2 li {
	text-align: center;
}
#menuBox #mainMenuBoxWrap ul#subLink2 li ul#license {
	margin-top: 50px;
}


#menuBox #mainMenuBoxWrap ul#subLink2 #license {
	background-color: #EEEEEE;
	text-align:center;
}



#menuBox #mainMenuBoxWrap ul#subLink2 li#private,
#menuBox #mainMenuBoxWrap ul#subLink2 li#buisiness {
	margin-top: 1px;
	background-color: #FFF;
	text-align: center;
	border: #DDDDDD 1px solid;
	width:   50%;
	float:      left;
	display:block;
	box-sizing: border-box;
}
#menuBox #mainMenuBoxWrap ul#subLink2 li#private {
	float:      left;
}
#menuBox #mainMenuBoxWrap ul#subLink2 li#buisiness {
	float:      right;
}
#menuBox #mainMenuBoxWrap p#twitter {
	margin-top: 18px;
	background-color: #00ABF0;
	text-align:center;
}
#menuBox #mainMenuBoxWrap ul#subLink2 p#twitter:hover {
	background-color: #FC0;
}

#menuBox #mainMenuBoxWrap ul#subLink2 li a#private:hover,
#menuBox #mainMenuBoxWrap ul#subLink2 li a#buisiness:hover {
	background-color: #B12CFA;
}

footer {
	background-image: url(https://copic.jp/twins/index/images/mainimage.png);
	background-position:center top ;
	background-repeat: repeat-x;
	padding-top: 70px;
	margin-top: 30px;
}




@media screen and (max-width: 1200px) {
	#mainImageBox  p#title img {
		margin-top: -100px;
	}
	#mainImageBox {
		float: none;
		margin-top:0;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}
	
	#menuBox {
		width: 96%;
		float: none;
		clear : both;
		padding-bottom: 40px;
		margin-top: 10px;
		margin-left:      2%;
		margin-right:    2%;
	}
	
	#menuBox #mainMenuBoxWrap {
		width:  430px;
		float: left;
	}
	#menuBox  #mainMenuBoxWrap #mainMenuBox #subLink2 {
		margin-bottom: 50px;
	}

	#menuBox #twitterBox {
		width:  50%;
		float: right;
		background: none;
	}
	#menuBox #twitterBox #campaign {
		margin: 0  auto 10px;
		width: 420px;
		padding-bottom: 10px;
		border-radius: 4px;
	}

}	



@media screen and (max-width: 960px) {
	#menuBox #mainMenuBoxWrap {
		width:  100%;
		float: none;
	}
	#menuBox #twitterBox {
		width:  100%;
		float: none;
		margin-left:auto;
		margin-right:auto;
		text-align:center;
	}
}

@media screen and (max-width: 660px) {
	#mainImageBox  p#twins img {
		width:95%;
		height:auto
	}
	#mainImageBox  p#title img {
		width:90%;
		height:auto
	}
	#menuBox #mainMenuBoxWrap {
		width:  100%;
		float: none;
	}
	#menuBox #twitterBox {
		float: none;
		margin-left:auto;
		margin-right:auto;
	}
	footer {
		width: 480px;
		margin-left:auto;
		margin-right:auto;
	}
	
}