﻿@charset "utf-8";

*{margin:0; padding:0;}

body{font-size:12px; font-family:"メイリオ","ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", Osaka,  Arial, sans-serif; line-height:150%; margin:0; padding:0;}

#TopMain{width:1000px; margin:0 auto; padding:50px 0 0 0;}
#Main{width:1000px; margin:0 auto;}

#Head{ margin:0; overflow:hidden; padding-top: 40px; padding-right: 0; padding-bottom: 40px; padding-left: 0; }
#Logo{width:250px; margin:0 35px 0 15px; float:left;}
#Logo a img{border:none;}
ul#HeadMenu2{ font-family:'Oswald', sans-serif; letter-spacing:0.1em; font-size:18px; padding:12px 0 0 0; font-weight: 700; }
ul#HeadMenu2 li{list-style-type:none; display:inline; margin:0 18px 0 20px;}
ul#HeadMenu2 li a{color:#000; text-decoration:none;}
ul#HeadMenu2 li:last-child{margin-right:0px;}
ul#HeadMenu2 li a:hover{color:#666;}

ul#HeadMenu{padding:13px 0 0 0;}
ul#HeadMenu li{list-style-type:none; float:left; margin:0 16px; overflow:hidden;}
ul#HeadMenu li a{color:#000; text-decoration:none;}
ul#HeadMenu li a img{border:none;}
ul#HeadMenu li:last-child{margin-right:0px;}
ul#HeadMenu li a:hover{color:#666;}

ul#HeadMenu li#works{display:block; width:56px; height:13px;}
ul#HeadMenu li#works a:hover img{margin-left:-56px;}
ul#HeadMenu li#works_off a img{margin-left:-56px;}

ul#HeadMenu li#factory{display:block; width:70px; height:13px;}
ul#HeadMenu li#factory a:hover img{margin-left:-70px;}
ul#HeadMenu li#factory_off a img{margin-left:-70px;}

ul#HeadMenu li#profile{display:block; width:66px; height:13px;}
ul#HeadMenu li#profile a:hover img{margin-left:-66px;}
ul#HeadMenu li#profile_off a img{margin-left:-66px;}

ul#HeadMenu li#section{display:block; width:66px; height:13px;}
ul#HeadMenu li#section a:hover img{margin-left:-66px;}
ul#HeadMenu li#section_off a img{margin-left:-66px;}

ul#HeadMenu li#contact{display:block; width:71px; height:13px;}
ul#HeadMenu li#contact a:hover img{margin-left:-71px;}
ul#HeadMenu li#contact_off a img{margin-left:-71px;}

ul#HeadMenu li#recruit{display:block; width:67px; height:13px;}
ul#HeadMenu li#recruit a:hover img{margin-left:-67px;}
ul#HeadMenu li#recruit_off a img{margin-left:-67px;}

ul#HeadMenu li#sunhouse{display:block; width:84px; height:13px;}
ul#HeadMenu li#sunhouse a:hover img{margin-left:-84px;}

div#Contents{padding:50px 30px;}
div.Wrap{overflow:hidden;}
div#Wrap940{overflow:hidden;}
div#Wrap900{overflow:hidden; padding:0 20px;}
div#Wrap860{overflow:hidden; padding:0 40px;}
div.Wrap750{overflow:hidden; margin:35px 125px;}
div#Wrap740{overflow:hidden; padding:0 100px;}
div#Wrap740 h3{font-size:24px; padding:30px 0 0 0;}
div#Wrap740 p{ line-height:22px; padding:15px 0 20px 0; }
div.Wrap720{overflow:hidden; margin:35px 140px;}

/*--------------   トップページ　INDEX.html   -----------------*/
div#MImgTop{height:600px; display:block; position:relative; overflow:hidden;}
div#MImgTop img{position:absolute; left:0; top:0;}
div#MImgTop h1{color:#FFF; font-family:'Oswald', sans-serif; font-size:24px; line-height:32px; letter-spacing:0.1em; position:absolute; left:550px; top:160px;}
div#MImgTop p{color:#FFF; font-size:12px; line-height:20px; font-weight:bold; letter-spacing:0.1em; position:absolute; left:550px; top:270px;}
div#MImgTop img#TInt{left:0; top:430px;}
div#MImgTop img#TLog{left:370px; top:545px;}

div#TopWorks{width:500px; height:200px; float:left;}
div#TopWorks a:hover img{opacity:0.55;}

div#TopFactory{width:500px; height:200px; float:left;}
div#TopFactory a:hover img{opacity:0.55;}

div#NewsWrap{background-color:#E5E5E5; padding:25px 95px 25px 25px;}
div#NewsWrap h3{font-size:18px; font-family:'Oswald', sans-serif; line-height:24px; letter-spacing:0.4em; margin:0 0 0 115px; float:left;}
div#News{overflow:hidden;}
div#News dl{padding:0 0 0 35px;}
div#News dl dt{float:left;}
div#News dl dd{ margin:0 0 0 90px;}

div#TopProfile{width:500px; height:200px; float:left;}
div#TopProfile a:hover img{opacity:0.55;}

div#TopSection{width:500px; height:200px; float:left;}
div#TopSection a:hover img{opacity:0.55;}

ul#TopBanner{overflow:hidden;}
ul#TopBanner li{list-style-type:none; width:240px; background-color:#000; position:relative; float:left;}
ul#TopBanner li a{text-decoration:none; display:block; width:240px; height:120px;}
ul#TopBanner li a:hover img{opacity:0.55;}
ul#TopBanner li a span{font-family:'Oswald', sans-serif; font-size:20px; letter-spacing:0.3em; position:absolute; left:20px; top:20px;}
ul#TopBanner li a span.Black{color:#000;}
ul#TopBanner li a span.White{color:#FFF;}


/*--------------   実績一覧　WORKS.html   -----------------*/
div#MImgWorks{height:100px; display:block; position:relative;}
div#MImgWorks img{position:absolute; left:0; top:0;}
div#MImgWorks h1{font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:60px;}
div#MImgWorks p{font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:280px; top:48px;}

ul.Clm3Works img{margin:0 auto;}
ul.Clm3Works li{list-style-type:none; width:300px; float:left;}
ul.Clm3Works li a{display:block; width:280px; color:#000; text-decoration:none; padding:10px;}
ul.Clm3Works li a:hover{background-color:#EAEBEB;}
ul.Clm3Works li img{padding:0;}
ul.Clm3Works li p{line-height:26px; padding:0 0 25px 0;}
ul.Clm3Works li p span{font-size:16px; letter-spacing:0.1em; font-weight:bold;}


/*--------------   工場紹介　FACTORY.html   -----------------*/
div#MImgFactory{height:670px; display:block; position:relative;}
div#MImgFactory img{position:absolute; left:0; top:0;}
div#MImgFactory h1{color:#FFF; font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:70px;}
div#MImgFactory p{color:#FFF; font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:100px; top:110px;}

div#Com01{overflow:hidden; padding:0 0 50px 0;}
div#Com01Img{width:300px; padding:0 35px 0 0; float:left;}
div#Com01Tex{width:565px; float:left;}
div#Com01Tex h3{font-size:20px; line-height:30px;}
div#Com01Tex p{line-height:24px; padding:10px 0 0 0;}


/*--------------   会社概要　PROFILE.html   -----------------*/
div#MImgProfile{height:670px; display:block; position:relative;}
div#MImgProfile img{position:absolute; left:0; top:0;}
div#MImgProfile h1{font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:90px; top:50px;}
div#MImgProfile h2{font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:90px; top:110px;}
div#MImgProfile p{width:400px; font-size:12px; line-height:20px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:90px; top:180px;}
div#MImgProfile p#PName{position:absolute; left:270px; top:500px;}
div#MImgProfile p#PName span{font-size:24px; letter-spacing:0.2em; line-height:36px; font-weight:bold;}

div#AccMap{width:740px; margin:0; padding:40px 0 0 0;}


/*--------------   セクション　SECTION.html   -----------------*/
div#MImgSection{height:360px; display:block; position:relative;}
div#MImgSection img{position:absolute; left:0; top:0;}
div#MImgSection h1{color:#FFF; font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:160px;}
div#MImgSection p{color:#FFF; font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:100px; top:200px;}

div.SecClmL{width:360px; text-align:center; float:left;}

div.SecClmC{width:300px; float:left;}
div.SecClmC h2{font-size:32px; letter-spacing:0.1em; line-height:42px; padding:30px 0 24px 0;}
div.SecClmC p{line-height:26px;}

div.SecClmR{width:280px; text-align:center; float:left;}


/*--------------   企画　PLANNING.html   -----------------*/
div#MImgPlanning{height:400px; display:block; position:relative;}
div#MImgPlanning img{position:absolute; left:0; top:0;}
div#MImgPlanning h1{color:#FFF; font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:160px;}
div#MImgPlanning p{color:#FFF; font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:100px; top:200px;}


/*--------------   お問い合わせ　CONTACT.html   -----------------*/
div#MImgContact{height:360px; display:block; position:relative;}
div#MImgContact img{position:absolute; left:0; top:0;}
div#MImgContact h1{font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:130px;}
div#MImgContact p{font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:100px; top:230px;}


/*--------------   求人情報　RECRUIT.html   -----------------*/
div#MImgRecruit{height:360px; display:block; position:relative;}
div#MImgRecruit img{position:absolute; left:0; top:0;}
div#MImgRecruit h1{color:#FFF; font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; position:absolute; left:100px; top:300px;}
div#MImgRecruit p{color:#FFF; font-size:16px; line-height:24px; font-weight:bold; letter-spacing:0.2em; position:absolute; left:340px; top:270px;}

dl#RecDet{overflow:hidden;}
dl#RecDet dt{ width:140px; text-align:right; float:left; font-size: 140%; }
dl#RecDet dd{ margin:0 0 25px 320px;}


/*--------------   実績詳細　WORKS001.html～   -----------------*/
div#WorkDet{overflow:hidden;}
div#WorkDet h1{width:210px; font-family:'Oswald', sans-serif; font-size:36px; letter-spacing:0.3em; text-align:center; padding:20px; float:left;}
div#WorkCom{width:650px; float:left;}
div#WorkCom h2{font-size:14px; line-height:30px;}
div#WorkCom h2 span{font-size:22px;}
div#WorkCom p{line-height:24px;}


/*--------------   汎用   -----------------*/
div.Clm2{width:470px; float:left;}
div.Clm2 h3{font-size:26px; line-height:30px; letter-spacing:0.4em; margin:0 0 15px 0;}
div.Clm2 dl dt{ width:130px; text-align:justify; text-justify:inter-ideograph; float:left;}
div.Clm2 dl dd{ margin:0 0 8px 160px;}

div#Wrap900 div.Clm2L{width:440px; padding:10px 20px 0 0; float:left;}
div#Wrap900 div.Clm2R{width:440px; padding:10px 0 0 0; float:left;}


div.ClmWrap{overflow:hidden;}
div.Clm3{width:33%; float:left;}
div.Clm3 h2{font-size:32px; letter-spacing:0.1em; line-height:42px; padding:0 0 24px 0;}
div.Clm3 p{line-height:26px;}

div.Clm4Wrap{overflow:hidden;}
ul.Clm4{overflow:hidden; padding:35px 18px 20px 18px;}
ul.Clm4 li{width:220px; list-style-type:none; margin:3px; float:left;}

ul.ImgClm2{width:740px; margin:0; padding:15px 0 0 0;}
ul.ImgClm2 li{width:365px; float:left; list-style-type:none; padding:0 10px 0 0;}
ul.ImgClm2 li:last-child{padding:0;}

ul.ImgClm3{width:740px; margin:0; padding:15px 0 0 0;}
ul.ImgClm3 li{width:240px; float:left; list-style-type:none; padding:0 10px 0 0;}
ul.ImgClm3 li:last-child{padding:0;}

ul.ImgClm3_2{width:720px; margin:0 auto; padding:15px 0 0 0;}
ul.ImgClm3_2 li{width:240px; float:left; list-style-type:none; padding:0;}
ul.ImgClm3_2 li:last-child{padding:0;}


footer{margin:0; padding:80px 0 0 0; overflow:hidden; zoom:1;}

div#FootLogo{width:260px; padding:0 0 0 20px; float:left;}
address{font-style:normal;}

ul#FtLink{margin:0; padding:0; font-size:8px; line-height:14px;}
ul#FtLink li{list-style-type:none; float:left;}
ul#FtLink li a{display:block; width:80px; margin:0 2px; padding:3px; height:80px; color:#666; text-decoration:none;}
ul#FtLink li a span{ font-family:'Oswald', sans-serif; line-height:24px; color:#000; font-size:14px; font-weight: 300; }
ul#FtLink li a:hover{background-color:#EAEBEB;}

div#copy{text-align:right; padding:10px 20px;}



/*ギャラリー全体のコンテナー*/
#stage {
	position: relative;
	max-width: 900px;
	margin:35px 0;
}
/*全サムネイルのコンテナー*/
#thumbs{font-size:0; padding:10px 0 0 0;}
#thumbs label{ margin-top: 0; margin-right: 14.5px; margin-bottom: 0; margin-left: 0; }
#thumbs label.llast{margin:0;}
/*サムネイルの幅、ポインターを手のひら*/
#thumbs label img {
	width:116px;
	cursor: pointer;
}
/*ラジオボタンを非表示に*/
#r1, #r2, #r3, #r4, #r5, #r6, #r7, #r8, #r9, #r10 {
	display:none; width:0; height:0;
}
/*表示写真の初期配置（全部透明に）とtransition設定*/
.photo {
	position: absolute;
	left: 0;
	top: 0;
}
.photo img {
	width:100%;
	opacity: 0;
	-webkit-transition: opacity 1s ease;
	transition: opacity 1s ease;
}
/*チェックされたサムネイルに相当する写真だけを表示*/
#r1:checked ~ #photo1 img, #r2:checked ~ #photo2 img, #r3:checked ~ #photo3 img, #r4:checked ~ #photo4 img, #r5:checked ~ #photo5 img, #r6:checked ~ #photo6 img, #r7:checked ~ #photo7 img, #r8:checked ~ #photo8 img, #r9:checked ~ #photo9 img, #r10:checked ~ #photo10 img {
	opacity: 1;
}
