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


#content{
	width:100%;
	background:url(../img/main.jpg) no-repeat top center;
	padding-top:340px;
}
#content h2{
	display:none;
}
#nSubNav li{
	background:url(../img/ico_subnav.gif) no-repeat 0 4px;
}





#content #main{
	width:660px;
	float:right;
	margin-top:120px;
}
#profile #content #main{
	padding-top:360px;
	position:relative;
	margin-top:60px !important;
}




#content #subNav{
	width:280px;
	float:left;
	-moz-border-radius:40px;
	-webkit-border-radius:40px;
	border-radius:40px;
	box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
	-moz-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
	-webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
	-o-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
	-ms-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.1);
}
#subNav em{
	display:none;
}
#content #subNav .subNavInner{
	background:#fff;
	-moz-border-radius:40px;
	-webkit-border-radius:40px;
	border-radius:40px;
	padding:40px 20px 40px 30px;
	box-shadow: 0 0 20px 4px rgba(0,0,0,0.06) inset;
	-moz-box-shadow: 0 0 20px 4px rgba(0,0,0,0.06) inset;
	-webkit-box-shadow: 0 0 20px 4px rgba(0,0,0,0.06) inset;
	-o-box-shadow: 0 0 20px 4px rgba(0,0,0,0.06 inset);
	-ms-box-shadow: 0 0 20px 4px rgba(0,0,0,0.06) inset;
	border:1px solid #eaeaea;
}
#content #subNav p{
	text-align:center;
	margin-bottom:30px;
}
#content #subNav li{
	background:url(../img/ico.png) no-repeat 0 6px;
	padding-left:22px;
	margin-bottom:7px;
	font-weight:bold;
	color:#777;
	font-size:16px;
	line-height:1.3;
}
#content #subNav li a:visited,
#content #subNav li a:link,
#content #subNav li a:active{
	color:#777;
}





#content .inner{
	width:980px;
	margin:0 auto;
}
#content .inner:after{
	content:"";
	clear:both;
	display:block;
}
#content .inner p.txt{
	font-size:16px;
	font-weight:bold;
	color:#999;
	margin:15px 0 30px;
}
#content .inner p.txt span{
	color:#f06398;
}
#content .inner .wkBlue{
	background:#dbf5ff;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	padding:65px 60px 80px;
	font-weight:bold;
	position:relative;
	z-index:1000;
}
#content .inner .wkBlue .box:first-child{
	margin-bottom:70px;
}
#content .inner .wkBlue h3{
	font-size:30px;
	margin-bottom:20px;
	color:#066bdd;
	line-height:1.2;
}
#content .inner .wkBlue span{
	position:absolute;
	z-index:10;
}
#content .inner .wkBlue p{
	font-size:15px;
}




/*
プロフィール-----------------------------------------------*/

#profile #main{
	width:620px;
	margin-right:40px;
	text-align:center;
}
#profile #content #main .btn01{
	position:absolute;
	left:120px;
	top:-40px;
}
#profile .wkBlue h3{
	font-size:26px !important;
	margin-bottom:10px !important;
}




/*
コラム-----------------------------------------------*/

#content .wkBlue{
	margin-top:50px;
}
#content #main h3.md{
	padding-left:20px;
}




/*記事内キャラクター---------------------------------------------*/

.column01 #content .inner .wkBlue span.tp{
	right:40px;
	top:45px;
}
.column01 #content .inner .wkBlue span.mdl{
	 right:205px;
	 top:405px;
}
.column01 #content .inner .wkBlue span.btm{
	 right:30px;
	 bottom:-20px;
}
.column02 #content .inner .wkBlue span.tp{
	right:45px;
	top:20px;
}
.column02 #content .inner .wkBlue span.mdl{
	right:30px;
	top:430px;
}
.column02 #content .inner .wkBlue span.btm{
	right:80px;
	bottom:-5px
}
.column03 #content .inner .wkBlue span.tp{
	right:200px;
	top:-25px;
}
.column03 #content .inner .wkBlue span.mdl{
	 right:25px;
	 top:465px;
}
.column03 #content .inner .wkBlue span.btm{
	left:280px;
	bottom:-10px;
}





/*=====================================

	スマホサイト縦
	
======================================*/

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

#main{
	width:100% !important;
	float:none !important;
}
#subNav{
	width:100% !important;
	margin-top:40px;
}
#subNav p{
	display:none;
}
#subNav em{
	display:block;
	color:#2fb4e9;
	font-size:22px;
	margin-bottom:15px;
	font-weight:bold;
}




#content .inner{
	width:100% !important;
}
#content h2{
	display:block;
}
#content #main .btn01{
	left:50%;
	margin-left:-125px;
}
#profile #content #main{
	padding-top:260px;
}
#content .inner .wkBlue h3 {
    margin-bottom: 15px;
	font-size:22px !important;
}
#profile #main{
	width:100% !important;
	float:none !important;
}
#profile #content .inner img{
	width:250px;
}
#profile #content #main .btn01{
	display:block;
	width:100%;
	text-align:center;
}
#content #main{
	margin-top:0;
}
#content .inner p.txt {
    margin: 15px 0px 0;
}
#content .inner .wkBlue{
	padding:60px 25px 75px;
    margin-top: 20px;
}





/*記事内キャラクター---------------------------------------------*/

.column01 #content .box:first-of-type h3,
.column03 #content .box:first-of-type h3{
	padding-right:90px;
	min-height:80px;
}
#content .inner .wkBlue span.mdl{
	display:none !important;
}
.column01 #content .inner .wkBlue span.tp{
	right:-20px;
	top:35px;
}
.column01 #content .inner .wkBlue span.btm{
	 right:30px;
	 bottom:0;
}
.column02 #content .inner .wkBlue span.tp{
	right:-65px;
	top:-20px;
}
.column02 #content .inner .wkBlue span.btm{
	right:-15px;
	bottom:-5px;
}
.column03 #content .inner .wkBlue span.tp{
	right:0px;
	top:45px;
}
.column03 #content .inner .wkBlue span.btm{
	left:130px;
	bottom:25px;
}
#content .inner .wkBlue span img{
	max-width: 80% !important;
}
.column02 #content .inner .wkBlue span.tp img{
	max-width: 65% !important;
}
.column03 #content .inner .wkBlue span.tp img{
	max-width: 100% !important;
}

}