﻿@charset "UTF-8";
.submenu ul li.factory a { color: #fff;}
.factory_naruto .area { width:980px; margin:auto; text-align:center; padding-top:60px; padding-bottom:60px;}
.factory_naruto iframe { border: 1px solid; box-sizing: content-box;}
.factory_naruto .ftmenu ul li.naruto { background:url(../images/factory/nav001.gif) no-repeat right 2px bottom 2px #ddd;}
@media all and (max-width: 767px) {
.factory_naruto .area { width:100%;}
.factory_naruto iframe { width:280px; height:158px;}
}


/* background */
.factory_naruto .block_01 { background: url(../images/factory_naruto/background001.jpg); -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
.factory_naruto .block_02 { background: url(../images/factory_naruto/background002.jpg); -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
.factory_naruto .block_03 { background: url(../images/factory_naruto/background003.jpg); -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
.factory_naruto .block_04 { background: url(../images/factory_naruto/background004.jpg); -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
.factory_naruto .block_05 { background: url(../images/factory_naruto/background005.jpg); -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center bottom;}
@media all and (min-width: 768px) and (max-width: 980px) {
.factory_naruto .block_01, .factory_naruto .block_02, .factory_naruto .block_03, .factory_naruto .block_04 { width:980px;}
}

/* block_01 */
.factory_naruto .block_01 { color:#fff;}
.factory_naruto .block_01 h2 { font-size:24px; line-height:240%; letter-spacing:3px;}
.factory_naruto .block_01 h3 { font-size:42px; line-height:180%; letter-spacing:3px; margin-bottom:20px;}
.factory_naruto .block_01 p { font-size:16px; line-height:180%; letter-spacing:3px;}
.factory_naruto .block_01 p br.pause { margin-bottom:2em;}
@media all and (max-width: 767px) {
.factory_naruto .block_01 h2 { font-size:20px; letter-spacing:1px;}
.factory_naruto .block_01 h3 { font-size:24px; letter-spacing:1px;}
.factory_naruto .block_01 p { font-size:16px; letter-spacing:1px;}
}


/* spot */
.factory_naruto .spot { margin-top:60px;}
.factory_naruto .spot p.catch_01 { font-size:28px; line-height:180%;}
.factory_naruto .spot p.catch_02 { font-size:32px; line-height:140%;}
.factory_naruto .spot p br { display:none;}
.factory_naruto .spot ul { width:860px; margin:auto; margin-top:20px; overflow:hidden;}
.factory_naruto .spot ul li { float:left; width:390px; margin:20px; border:#fff thin solid; box-sizing:border-box; font-size:24px; line-height:120%; background: url(../images/factory/arrow_bottom.png) 188px 80px  no-repeat;}
.factory_naruto .spot ul li span { display:block;}
.factory_naruto .spot ul li span.text_01 { font-size:16px;}
.factory_naruto .spot ul li a { color:#fff; text-decoration: none; display: block; padding-top:18px; padding-bottom:26px;}
@media all and (min-width: 981px) {
.factory_naruto .spot ul li a { -moz-transition: all 0.3s linear; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear;}
.factory_naruto .spot ul li a:hover { background-color: rgba(255,255,255,0.5);}
}
@media all and (max-width: 767px) {
.factory_naruto .spot p.catch_01 { font-size:16px;}
.factory_naruto .spot p.catch_02 { font-size:20px;}
.factory_naruto .spot p br { display: block;}
.factory_naruto .spot ul { width:300px;}
.factory_naruto .spot ul li { font-size:18px; margin:10px; background: url(../images/factory/arrow_bottom.png) 145px 62px  no-repeat; width:100%; margin-left:0; margin-right:0;}
}


/* headline */
.factory_naruto .headline { font-size:32px; line-height:120%; letter-spacing:3px;}
.factory_naruto .headline h4 img { width:120px; margin-top:20px;}
.factory_naruto .headline span { display:block;}
.factory_naruto .headline span.text_01 { font-size:18px;}
@media all and (max-width: 767px) {
.factory_naruto .headline { font-size:24px;}
.factory_naruto .headline .area { padding-top:20px; padding-bottom:20px;}
.factory_naruto .headline h4 img { width:80px; margin-top:10px;}
.factory_naruto .headline span.text_01 { font-size:14px;}
}


/* block_02,3,4*/
@media all and (max-width: 767px) {
.factory_naruto .block_02 .area,
.factory_naruto .block_03 .area,
.factory_naruto .block_04 .area,
.factory_naruto .block_05 .area{ padding:30px 0; width:80%;}
}


/* column */
.factory_naruto .column { width:820px; margin:auto; margin-bottom:80px; overflow:hidden;}
.factory_naruto .column p { float:left; text-align:left; font-size:16px; line-height:200%; letter-spacing:3px;}
.factory_naruto .column img { float:right; margin-right:20px; width:200px;}
@media all and (max-width: 767px) {
.factory_naruto .column { width:100%; margin-bottom:60px;}
.factory_naruto .column p { font-size:14px; line-height:180%; letter-spacing:1px;}
.factory_naruto .column p br { display:none;}
.factory_naruto .column img { float: inherit; text-align:center; margin-top:30px; margin-right:0px; width:100%;}
}