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

body {

	/* iOS対応*/
	-webkit-text-size-adjust: 100%;
	min-width: 320px;
	_display: inline;
	_zoom:1;
}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
.wrapper {
	margin-left: auto;
	margin-right: auto;
	min-width:480px;
	max-width:1180px;
}
.wrapper .mainBox {
	margin-left: 10px;
	margin-right: 10px;
}


/*　ヘッダー　*/
header {
	margin-top: 10px;
	margin-bottom: 10px;
}
header #copicTwins {
	margin-top: 7px;
	float:left;
	width: 254px;
}
header #copicTwins img#logo {
	width: 254px;
	height:auto;
}

header ul#subMenu,
header ul#subMenu li {
	list-style:  none;
	margin:     0;
	padding:   0;
}
header ul#subMenu {
	float: right;
	margin-top:10px;
}
header ul#subMenu li {
	display: inline-block;
	margin-left: 0.5em;
	margin-right: 0.5em;
}
header ul#subMenu li #twBtn {
	margin-bottom: -7px;
}
header #subMenu a:link,
header #subMenu a:visited{
	color: #606060;
}



/*　タイトル　*/
#titleBox {
	background-color: #1620c2;
	background-image: url(https://copic.jp/twins/common/images/title_bg.png);
	background-repeat: repeat-x;
	background-position: left top;
	height: 125px;
	margin-top:10px;
}
#titleBox #h1Box {
	width: auto;
	float:left;
}

#titleBox #h1Box h1 {
	padding:40px 0 15px 15px;
	font-size: 24px;
	color:#F3F3F3;
}



#titleBox #mainMenuBox {
	float: right;
	width: 440px;
	margin-top: -17px;
	margin-right: 10px;
}
#titleBox #mainMenuBox #mainLink {
	background-image: url(https://copic.jp/twins/common/images/title_btn_bg.png);
	background-repeat: repeat-x;
	background-position: left bottom;
}

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



h4 {
	padding: 4px;
	font-size: 16px;
	background-color: #444;
	color: #FFF;
	border-bottom: #CB7476 solid 4px;
}

#copicTwins #camp {
	margin-left: 10px;
	margin-top: -7px;
}




/*　フッター　*/
footer {
	display:  block;
	margin-top: 50px;
	margin-bottom: 30px;
	clear:both;
}

footer ul#footerLink,
footer ul#footerLink li {
	margin:    0;
	padding:  0;
}
footer ul#footerLink {
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
}
footer ul#footerLink li {
	display: inline-block;
	margin-left:    0.6em;
	margin-right: 0.6em;
	font-size: 14px;
}
footer p#copyRight,
footer p#privacy {
	text-align: center;
	font-size:11px;
	color:#787878;
}


.unitBox5 {
	width:           18%;
	margin-left:    1%;
	margin-right:  1%;
	display: inline-block;
}



@media screen and (max-width: 960px) {

	#titleBox #h1Box {
		width: 100%;
		float:none;
	}
	#copicTwins #camp {
		margin-left: 0;
	}
	#titleBox #mainMenuBox {
		width: 100%;
		float: none;
		text-align:center;
	}
	/*　タイトル　*/
	#titleBox {
		height: auto;
	}
}


@media screen and (max-width: 640px) {
	header #copicTwins {
		width: 100%;
		float: none;
		text-align:center;
		margin-bottom:10px;
	}
	header #subMenu {
		width: 100%;
		float: none;
		text-align:center;
	}

	header ul#subMenu{
		margin-top:   0;
	}
	header #copicTwins img#logo {
		width: 340px;
		height:auto;
	}

	/*　タイトル　*/
	#titleBox {
		height: auto;
		background-size:2%;
	}
	#titleBox #h1Box {
		width: 100%;
		float: none;
	}
	#titleBox #h1Box h1 {
		font-size: 18px;
		padding-top:5%;
	}


	#copicTwins #camp {
		margin-left: 0;
	}
	#titleBox #mainMenuBox {
		width: 100%;
		float: none;
		text-align:center;
	}
	.unitBox5 {
		width:           46%;
		margin-left:    1%;
		margin-right:  1%;
	}
	footer {
		width: 100%;
		margin-right:auto;
		margin-right:auto;
	}
}