/*
PC用CSS
*/
/*======================================

	PC版非表示設定

=======================================*/
body#index div#container header#header h1{display: none;}
body#index div#container header#header div.menu-globalnavi-container{display: none;}
body#index header#header{display: none;}

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

	パララックス設定

=======================================*/
h2 img.title{margin-bottom: 50px;}
#sp_intro{display: none;}
#sp_second{display: none;}
#sp_third{display: none;}

#intro, #second, #third{
	width: 100%;
}
#intro{
	background:url(images/firstBG.jpg) 50% 0 no-repeat fixed;
	height: 1200px;
	margin: 0 auto;
	padding: 0;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
#second{
	background: url(images/secondBG.jpg) 50% 0 no-repeat fixed;
	height: 1200px;
	margin: 0 auto;
	padding: 0;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-webkit-overflow-scrolling:touch;
}
#third{
	background: url(images/thirdBG.jpg) 50% 0 no-repeat fixed;
	height: 1200px;
	margin: 0 auto;
	padding: 0;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

@media screen and (min-width:480px) and ( max-width:1050px){
#intro{
	background:url(images/firstBG.jpg) center top no-repeat;
	height: 1200px;
	margin: 0 auto;
	clear:both;
	background-attachment: scroll;
	margin-top: -50px;
}
#second{
	background:url(images/secondBG.jpg) center top no-repeat;
	height: 1200px;
	margin: 0 auto;
	clear:both;
	background-attachment: scroll;
	margin-top: -700px;
}
#third{
	background:url(images/thirdBG.jpg) center top no-repeat;
	height: 1200px;
	margin: 0 auto;
	clear:both;
	background-attachment: scroll;
	margin-top: -700px;
	margin-bottom: -50px;
}}
#parallax-header{
	width:100%;
	max-width: 960px;
	margin: 0 auto;
	left:50%;
}
@media screen and (min-width:960px) {
#parallax-logo{
	position: fixed;
	z-index: 999;
	top: 19px;
}
}
@media screen and (min-width:480px) and ( max-width:960px) {
#parallax-logo{
	position: fixed;
	z-index: 999;
	top: 19px;
	left:50%;
	margin-left: -100px;
}
}

@media screen and (min-width:960px) {
#parallax-nav{
	list-style: none;
	position: fixed;
	z-index: 999;
	top: 55px;
	right: 15%;
}
}
@media screen and (min-width:480px) and ( max-width:960px) {
#parallax-nav{
	list-style: none;
	position: fixed;
	z-index: 999;
	top: 90px;
	left:50%;
	margin-left: -250px;
}
}

#parallax-nav li{
	float: left;
	margin: 0 0 15px 0;
	font-family: 'Cinzel', serif;
	font-size: 16px;
	font-weight: normal;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.9);
}

#parallax-nav li a{color: #F2F2F2;}
#parallax-nav li a:hover{color: #F2F2F2;}


.float-left{
	float: left;
	margin: 0 0 0 20px;
}

.float-right{
	float: right;
	margin: 0 0 0 0;
}

.float-center{
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
}



.story{
	position:relative;
	width:100%;
	max-width: 960px;
	margin: 0 auto;
	font-family: "メイリオ", "Meiryo", sans-serif;
	font-weight: bold;
	font-size: 1.3em;
	line-height: 2.0;
}


.story p{margin: 20px auto 0 auto;}
.story .float-left {padding: 50px 0 0 0;}
.story .float-right{padding: 50px 0 0 0;}
.story .float-center{padding: 150px 0 0 0; text-align:center;}

@media screen and (min-width : 480px) and (max-width: 1024px) {/*スマフォ・タブレット用*/
.story .float-left {padding: 50px 0 0 0;}
.story .float-right{padding: 50px 0 0 0;}
.story .float-center{padding: 50px 0 0 0; text-align:center;}
}

.story .float-left p{
	color: #f2f2f2;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.9);
}
.story .float-right p{
	color: #f2f2f2;
	text-shadow: 2px 2px 3px rgba(0,0,0,0.9);
}
.story .float-center p{
	color: #F2F2F2;
	text-shadow: 2px 2px 3px rgba(102,102,102,0.5);
}
.story .float-left h2, .story .float-right h2{
	text-align: left;
	padding: 0;
	position: relative;
}
.story .float-left h2::before, .story .float-right h2::before, .story .float-center h2::before {
	background: none;
}
.story a{color: #fff;}
.story a:visited{color: #fff; text-decoration:none;}
.story a:hover{color: #fff; text-decoration:none;}
.story a:active{color: #fff; text-decoration:none;}

p#pb-about a{
	float:left;
	background-color: rgba(91,79,69, .7);
	border: solid 1px #897f75;
	box-shadow: 0 3px 3px rgba(0, 0, 0, .2);
	text-shadow: 0px 1px 0px rgba(137,127,117, .4);
	width: 200px;
	font-weight: normal;
	font-size: 0.7em;
	text-align:center;
	letter-spacing: 0.5em;
}
p#pb-about a:hover {
	background-color: #5b4f45;
}


p#pb-products a{
	float:left;
	background-color: rgba(45,119,77, .7);
	border: solid 1px #628074;
	box-shadow: 0 3px 3px rgba(0, 0, 0, .2);
	text-shadow: 0px 1px 0px rgba(111,152,134, .4);
	width: 200px;
	font-weight: normal;
	font-size: 0.7em;
	text-align:center;
	letter-spacing: 0.5em;
}
p#pb-products a:hover {
	background-color: #2d774d;
}



p#pb-recruit a{
	content: '';
	display: block;
	clear: both;
	margin: 20px auto;
	background-color: rgba(52,52,52, .7);
	border: solid 1px #666666;
	box-shadow: 0 3px 3px rgba(0, 0, 0, .2);
	text-shadow: 0px 1px 0px rgba(102,102,102, .4);
	width: 200px;
	font-weight: normal;
	font-size: 0.7em;
	text-align:center;
	letter-spacing: 0.5em;
}
p#pb-recruit a:hover {
	background-color: #343434;
}
/*======================================

	スライダーの見え方設定

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

body.page div#header{background: url("images/background.png") repeat;}
div.page-header{margin-top: 70px;}

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

	footerの設定

=======================================*/
@media screen and (min-width:480px) and (max-width:1024px) {/*スマフォ・タブレット用*/
	body#index footer{
		margin-top: -500px;
	}
}
/*======================================

	h2の設定

=======================================*/
h2 {
	position: relative;
	text-align: center;
	font-size: 1.8em;
	letter-spacing: 0.5em;
}
h2 span {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 4em;
	padding: 0 1em 0 1.5em;
	background: url("images/background.png") repeat;
	text-align: left;
	font-weight: normal;
}
h2 strong {
	position: relative;
	z-index: 2;
	display: inline-block;
	margin: 0 4em;
	padding: 0 1em 0 1.5em;
	background: url("images/background.png") repeat;
	text-align: left;
	font-weight: normal;
}
h2::before {
	position: absolute;
	top: 50%;
	z-index: 1;
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background: #ccc;
	background: -webkit-linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
	background: linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
}


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

	h3の設定

=======================================*/
h3 {
	width:100%; /* 700px以下は幅いっぱいに広げる */
	max-width:700px; /* 最大幅の指定 */
	margin:30px auto 0 auto; /* ブロック要素の中央揃え */
	position: relative;
	font-size: 1.5em;
	font-weight: normal;
	padding: 0em 0.5em 0.5em 1.5em;
	border-bottom: 2px solid #ac1875;
}

h3:before{
    content: "□";
    font-size: 100%;
    position: absolute;
    color: #ac1875;
    top: -0.3em;
    left: 0.3em;
    height: 10px;
    width: 10px;
}

h3:after{
    content: "□";
    font-size: 100%;
    position: absolute;
    color: #dc7eb9;
    top: 0em;
    left: 0;
    height: 10px;
    width: 10px;
}
/*======================================

	pの設定

=======================================*/
p{
	font-size: 1.2em;
	line-height: 2.0;
}

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

	tableの設定

=======================================*/
.table > tbody > tr > td{width:75%;}
.table > tbody > tr > th{width:25%;}
.katudo > tbody > tr > td{width:85%; padding:10px; font-size:1.2em;}
.katudo > tbody > tr > th{width:15%; padding:10px; font-size:1.2em; vertical-align:top; font-weight:normal;}

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

	会社案内の設定

=======================================*/
div#about p{
	font-size: 1.3em;
	line-height: 3.0;
}
div#overview {background: url("images/bg_lace.png") no-repeat right center;}
div#about {background: url("images/bg_violin.png") no-repeat left top;}

div.nav{
	padding-top: 30px;
}

nav#aboutus{
	border-bottom: solid 1px #898989;
	padding: 0;
}
div.menu-aboutus-container{
	width:100%; /* 900px以下は幅いっぱいに広げる */
	max-width:900px; /* 最大幅の指定 */
	height:auto; /* 高さの指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
}
div.menu-aboutus-container li{
	float: left;
	list-style: none outside;
}
div.menu-aboutus-container ul.menu {
	overflow: hidden;
	padding: 0;
	margin: 0 0 -1px 0;
}
div.menu-aboutus-container li.menu-item {
	width: 150px;
	height: 30px;
	float: left;
	text-align: center;
}
div.menu-aboutus-container li.menu-item a {
background-image: url(images/aboutus_button.png);
    display: block;
    line-height: 30px;
    color: white;
    text-decoration: none;
}
div.menu-aboutus-container li.current-menu-item a {background-position: 0 -30px;}
div.menu-aboutus-container li.menu-item a:hover {background-position: 0 -60px;}


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

	採用情報の設定

=======================================*/
nav#recruit{
	border-bottom: solid 1px #898989;
	padding: 0;
}
div.menu-recruit-container{
	width:100%; /* 450px以下は幅いっぱいに広げる */
	max-width:450px; /* 最大幅の指定 */
	height:auto; /* 高さの指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
}
div.menu-recruit-container li{
	float: left;
	list-style: none outside;
}
div.menu-recruit-container ul.menu {
	overflow: hidden;
	padding: 0;
	margin: 0 0 -1px 0;
}
div.menu-recruit-container li.menu-item {
	width: 150px;
	height: 30px;
	float: left;
	text-align: center;
}
div.menu-recruit-container li.menu-item a {
	background-image: url(images/aboutus_button.png);
	display: block;
	line-height: 30px;
	color: white;
	text-decoration: none;
}
div.menu-recruit-container li.current-menu-item a {background-position: 0 -30px;}
div.menu-recruit-container li.menu-item a:hover {background-position: 0 -60px;}
div.child_page_excerpt{
	margin-top: 40px;
}
/*======================================

	製品案内

=======================================*/
nav#products{
	border-bottom: solid 1px #898989;
	padding: 0;
}
div.menu-products-container{
	width:100%; /* 300px以下は幅いっぱいに広げる */
	max-width:900px; /* 最大幅の指定 */
	height:auto; /* 高さの指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
}
div.menu-products-container li{
	float: left;
	list-style: none outside;
}
div.menu-products-container ul.menu {
	overflow: hidden;
	padding: 0;
	margin: 0 0 -1px 0;
}
div.menu-products-container li.menu-item {
	width: 150px;
	height: 30px;
	float: left;
	text-align: center;
}
div.menu-products-container li.menu-item.menu-item-520, div.menu-products-container li.menu-item.menu-item-856 {
	width: 300px;
}
div.menu-products-container li.menu-item a {
	background-image: url(images/aboutus_button.png);
	display: block;
	line-height: 30px;
	color: white;
	text-decoration: none;
}
div.menu-products-container li.menu-item.menu-item-520 a, div.menu-products-container li.menu-item.menu-item-856 a {
	background-image: url(images/aboutus_button_300.png);
}
div.menu-products-container li.current-menu-item a {background-position: 0 -30px;}
div.menu-products-container li.menu-item a:hover {background-position: 0 -60px;}

div#totalsystem h4{
	font-size: 1.5em;
	line-height: 1.8;
}
div#totalsystem dl{
	clear: both;
}
div#totalsystem dt{
	float: left;
	border-radius:1em;
	width: 250px;
	margin: 15px 0;
	padding: 10px;
	font-size: 1.2em;
	text-align: center;
}
div#totalsystem dd{
	float: left;
	margin: 15px 0;
	padding: 10px;
	font-size: 1.2em;
}
div#planning{
	width:100%; /* 660px以下は幅いっぱいに広げる */
	max-width:660px; /* 最大幅の指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
	background: url("images/system_planning.png") no-repeat left top;
	padding: 20px 20px 20px 60px;
	margin: 0 0 50px 0;
	height: 356px;
}
div#innovation{
	width:100%; /* 660px以下は幅いっぱいに広げる */
	max-width:660px; /* 最大幅の指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
	background: url("images/system_innovation.png") no-repeat left top;
	padding: 20px 20px 20px 60px;
	margin: 0 0 50px 0;
	height: 356px;
}
div#partnership{
	width:100%; /* 660px以下は幅いっぱいに広げる */
	max-width:660px; /* 最大幅の指定 */
	margin:0 auto; /* ブロック要素の中央揃え */
	background: url("images/system_partnership.png") no-repeat left top;
	padding: 20px 20px 20px 60px;
	margin: 0 0 50px 0;
	height: 356px;
}

dt#step1{background: #a21b6e;}
dt#step2{background: #ae3b87;}
dt#step3{background: #bf6ca8;}
dt#step4{background: #8868ab;}
dt#step5{background: #664196;}
dt#step6{background: #372869;}
dt#step7{background: #274465;}
dt#step8{background: #19548e;}
dt#step9{background: #5f90c1;}


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

	社内イベント（投稿）の設定

=======================================*/
main.events div.row p{margin-bottom: 0;}
main.events div.row{margin-bottom: 20px;}