/* CSS Document */
#usk_wap img{
	width:100%;
	max-width: 100%;
	height: auto;
}
#usk_wap a:hover img {
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}
#usk_wap a{
	outline: none;
}
#usk_wap *:focus {
	outline: none;
}
#usk_wap{
	background-color:#F8F0DF;
	background-size: 100%;
	max-width: 960px;
	width:auto;
	margin: 0 auto;
	text-align:center;
	outline: none;
}

/*****************************************************************************
****************** トップ ****************************************************
*****************************************************************************/
.usk_head{
	background-image:url(../img/subpage/wow_usk/top_img.jpg);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	width: 100%;
	z-indent: -9999;
	max-width: 960px;
	height: 100%;
	margin: auto;
	padding: 21% 0 21% 0;
}
.usk_head_book{
	text-align: left;
}
#usk_wap .usk_head_book a:hover img {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
}
#usk_wap .usk_head_book img {
    width: 75%;
}
.target {
	transition: .85s ;		/* アニメーションの秒数を指定 */
	-webkit-transform: rotateY( 0deg ) ;	/* iOS8(2015年9月頃まで)をサポート */
	transform: rotateY( 0deg ) ;
	margin: 0 ;
	padding: 0 ;
}
.usk_head_book:hover .target {
	-webkit-transform: rotateY( 360deg ) ;	/* iOS8(2015年9月頃まで)をサポート */
	transform: rotateY( 360deg ) 
}
@media screen and (min-width: 768px) {
	.book_sm{
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.usk_head_book{
		display: none;
	}
	.book_sm{
		margin-bottom: 10%;
	}
	#usk_wap .book_sm img{
		width:70%;
	}
}
@media screen and (max-width: 550px) {
	.usk_head_book img {
		width: 85%;
	}
}

/*****************************************************************************
****************** 共通 ******************************************************
*****************************************************************************/
#usk_allcon{
	padding: 0;
	margin: 0 auto;
	color: #000000;
}
.usk_con{
	width:72%;
	margin: 0 auto;
}
.usk_title{
	
}
.usk_title p{
	padding:0 0 4% 0;
}
.usk_con_title{
	font-size:2.5vw;
	font-weight: bold;
}
@media screen and (min-width: 960px) {
	.usk_con_title{
		font-size: 170%;
	}
}
@media screen and (max-width: 767px) {
	.usk_title p{
		padding:0 0 1% 0;
	}
	.usk_con_title{
		font-size: 4vw;
	}
	.usk_title .usk_con_title{
		padding:0 0 3% 0;
	}
}

/*****************************************************************************
****************** ムービーギャラリー ****************************************
*****************************************************************************/
.usk_movie{
	padding: 5% 0 0 0;
	background-image: url(../img/subpage/wow_usk/back_turtle.png);
	background-repeat: no-repeat;
	background-position: 3% 18%;
	background-size: 15%;
}
.usk_movie_con p{
	padding: 3% 0 3% 0;
}
@media screen and (max-width: 767px) {
	.usk_movie_con{
		margin-bottom:6%;
	}
	.usk_movie_con p{
		padding: 3% 0 0 0;
		font-size:3vw;
	}
}

/*****************************************************************************
****************** これが私の生きる道 ****************************************
*****************************************************************************/
.usk_myway{
	padding: 7% 0 3% 0;
	background-image:
		url(../img/subpage/wow_usk/back_pig.png),
		url(../img/subpage/wow_usk/back_surfing.png),
		url(../img/subpage/wow_usk/back_bridge.png),
		url(../img/subpage/wow_usk/back_cow.png);
	background-repeat: no-repeat;
	background-position: 
		95% 1%,
		5% 31%,
		95% 64%,
		5% 95%;
	background-size: 
		15%,
		23%,
		23%,
		17%;
}
.usk_myway_con{
	padding-bottom: 21%;
	position: relative;
}
.myway_num{
	width:auto;
	height:auto;
	background-size: 100%;
	background-repeat: no-repeat;
	text-align: left;
	line-height: 200%;
}
.myway_num01{
	background-image: url(../img/subpage/wow_usk/number01.png);
}
.myway_num02{
	background-image: url(../img/subpage/wow_usk/number02.png);
}
.myway_num03{
	background-image: url(../img/subpage/wow_usk/number03.png);
}
.myway_num p{
	margin: 5% 0 3% 0;
	font-size: 1.8vw;
}
#content p.myway_title{
	color: #024ba8;
}
.usk_myway_article{
	padding-left: 0;
}
.myway_num .usk_myway_article p{
	margin: 3% 0 0 0;
	font-size: 100%;
	text-align: left;
}
.usk_myway_article p a{
	border:1px solid #343C48;
	border-radius: 5px;
	width: 30%;
	margin:auto;
	padding: 2% 10%;
}
#content .usk_myway_article p a:hover{
	text-decoration:none;
	background-color:#555555;
	color:#ffffff;
}
.myway_preview{
	width:100%;
	height:auto;
}
.myway_img{
	position:absolute;
}
.usk_myway_img{
	padding:0;
}
.myway_img01{
	top: 69%;
}
.myway_img02{
	top: 60%;
}
.myway_img03{
	top: 60%;
}
.myway_img img{
	max-width:500px;
}
@media screen and (min-width: 960px) {
	.myway_num p{
		font-size: 125%;
	}
}
@media screen and (max-width: 890px) {
	.myway_num{
		line-height: 160%;
	}
}
@media screen and (max-width: 767px) {
	.usk_myway_con {
 	   padding-bottom: 10%;
	}
	.myway_num p{
		margin: 3% 0 3% 0;
		font-size: 2.8vw;
	}
	.myway_num{
		width:100%;
		background-size: 70%;
		background-position: right;
		line-height: 200%;
	}
}
@media screen and (max-width: 500px) {
	.myway_num{
		line-height: 160%;
	}
	.myway_num p{
		font-size: 3.3vw;
	}
}

/*****************************************************************************
****************** 住めば都。 ************************************************
*****************************************************************************/
.usk_best{
	background-color:#ffffff;
	background-image:
		url(../img/subpage/wow_usk/best-top.jpg),
		url(../img/subpage/wow_usk/back_chikin.png),
		url(../img/subpage/wow_usk/best_bottom.jpg);
	background-repeat: 
		no-repeat;
	background-position:
		top,
		95% 14%,
		bottom;
	background-size:
		100%,
		12%,
		100%;
	padding: 9% 0 9% 0;
}
.top-slider .slick-list{
	padding-top: 3%;
}
#link_msg_show{
	font-size:110%;
	background-color:#ffffff;
}
.hover_off{
	padding: 5% 0;
}
.hover_on{
	border:2px solid #000;
	border-radius: 2px;
	padding:1% 3%;
}
.top-slider > div img {
	transition: 0.5s;
	/*拡大されるスピードを設定*/
}
.top-slider > div img:hover {
	-moz-transform: scale(1.1,1.1);
	-webkit-transform: scale(1.1,1.1);
	-o-transform: scale(1.1,1.1);
	-ms-transform: scale(1.1,1.1);
	/*拡大される比率を設定*/
}
@media screen and (max-width: 960px) {
	#link_msg_show{
		font-size:1.5vw;
	}
}
@media screen and (max-width: 767px) {
	.usk_best{
		display: none;
	}
}

/*****************************************************************************
****************** 記事ピックアップ,バナー ***********************************
*****************************************************************************/
.usk_articles{
	padding: 7% 0 5% 0;
	background-image:url(../img/subpage/wow_usk/back_samurai.png);
	background-repeat: no-repeat;
	background-position: 5% 5%;
	background-size: 14%;
}
.usk_articles_con,
.usk_banner_con{
	padding-bottom:3%;
}
.usk_articles_con p{
	padding: 3% 0 3% 0;
}
.usk_articles_other{
	width:100%;
	margin:auto 0;
	text-align:center;
}
.usk_articles_other p a{
	border:1px solid #343C48;
	border-radius: 5px;
	width: 30%;
	margin:auto;
	padding: 1% 6%;
}
#content .usk_articles_other p a:hover{
	text-decoration:none;
	background-color:#555555;
	color:#ffffff;
}
@media screen and (max-width: 767px) {
	.usk_articles_other{
		padding-top: 5%;
	}
	.usk_articles_con p{
		padding: 3% 0 0 0;
		font-size: 3vw;
	}
	.usk_articles_other p a{
		padding: 3% 15%;
	}
}

/*****************************************************************************
****************** バナー ****************************************************
*****************************************************************************/
.usk_banner{
	background-color:#024ba8;
	background-image:url(../img/subpage/wow_usk/redwave.jpg);
	background-repeat:no-repeat;
	background-position:top;
	background-size: 100%;
	padding: 9% 0 3% 0;
}
.usk_banner p{
	border: 1px solid #555555;
	box-sizing:border-box;
	
}

/*****************************************************************************
****************** bootstrap調整 *********************************************
*****************************************************************************/
ul{
	margin-bottom:0;
}

