@charset "UTF-8";

/* IEのviewport設定 */
@-ms-viewport
{
    width: auto;
    initial-scale: 1;
}
@viewport
{
    width: device-width;
    initial-scale: 1;
}

/* -------------- */

.margin-top{
	margin-top:50px;
}

header .nav-box{
	padding:10px 50px 20px 50px;
}

/* h1上書きエリア */

header#head h1.h1_title{
	width:100%;
	text-align:left;
	font-size:12px;
	font-weight:normal;
}

header#head .logo_area { position: relative; float: left; }

header#head .header-eye h1.discription{
	font-size: 14px;
    position: absolute;
    top: 10px;
    left: 10px;
}

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

	body.home header#head{
		width:100%;
	}

	header#head .header-eye{
		width:100%;
	}

	header#head .header-eye h1.discription{
		position:static;
		padding:5px 0 0 0;
		line-height:140%;
	}

	header#head .logo_area { top: 0px; left: 0px; float: none; width: 100%; text-align: center; }
	header#head .logo_area img { width: 178px; }
	
}

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

	header#head .header-eye .t1{
		bottom:30px;
	}
	
	header#head .eye::after{
		top:40px;
	}

}

/* -------------  */

/* --- パンくず --- */
.breadcrumbs{
	text-align:right;
	margin:15px auto;
}

/* --- マウスオーバーで回転 --- */
.move01{
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
}

.move01:hover{
	transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
}
/* --------------------------- */

/* --- マウスオーバーでぶるぶる--- */
.move03 {
    color: #fff;
    display: block;
    text-decoration: none;
}
.move03:hover {
    animation: shake 0.2s linear infinite;
    -webkit-animation: shake 0.2s linear infinite;
}
@keyframes shake {
    0% { transform: translate(6px, 4px) rotate(0deg); }
    10% { transform: translate(-4px, -6px) rotate(-1deg); }
    20% { transform: translate(-8px, 0px) rotate(1deg); }
    30% { transform: translate(0px, 6px) rotate(0deg); }
    40% { transform: translate(4px, -4px) rotate(1deg); }
    50% { transform: translate(-4px, 6px) rotate(-1deg); }
    60% { transform: translate(-8px, 4px) rotate(0deg); }
    70% { transform: translate(6px, 4px) rotate(-1deg); }
    80% { transform: translate(-4px, -4px) rotate(1deg); }
    90% { transform: translate(4px, 8px) rotate(0deg); }
    100% { transform: translate(4px, -6px) rotate(-1deg); }
}
/* -------------------- */

/* --- 要素を移動＋フェードイン表示 --- */
.list-mv07{
	opacity: 0;
	transform: translate(0,60px); 
	-webkit-transform: translate(0,60px); 
}
.mv07{
	opacity: 1.0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}

/* ---------------------------------- */

/* --- 揺れるナッツ --- */
.swing {
margin:10px;
-moz-animation: swing linear 5s infinite;
-moz-transform-origin: center -30px 0;
-webkit-animation: swing linear 5s infinite;
-webkit-transform-origin: center -30px 0;
-ms-animation: swing linear 5s infinite;
-ms-transform-origin: center -30px 0;
-o-animation: swing linear 5s infinite;
-o-transform-origin:center -30px 0;
animation: swing linear 5s infinite;
transform-origin: center -30px 0;
display: block;
float:left;
}
@-moz-keyframes swing {
0% { -moz-transform: rotate(0deg) }
25% { -moz-transform: rotate(5deg); }
50% { -moz-transform: rotate(0deg); }
75% { -moz-transform: rotate(-5deg); }
100% { -moz-transform: rotate(0deg); }
}
@-webkit-keyframes swing {
0% { -webkit-transform: rotate(0deg); }
25% { -webkit-transform: rotate(5deg); }
50% { -webkit-transform: rotate(0deg); }
75% { -webkit-transform: rotate(-5deg); }
100% { -webkit-transform: rotate(0deg); }
}    
@-o-keyframes swing {
0% { -o-transform: rotate(0deg); }
25% { -o-transform: rotate(5deg); }
50% { -o-transform: rotate(0deg); }
75% { -o-transform: rotate(-5deg); }
100% { -o-transform: rotate(0deg); }
}
@-ms-keyframes swing {
0% { -ms-transform: rotate(0deg); }
25% { -ms-transform: rotate(5deg); }
50% { -ms-transform: rotate(0deg); }
75% { -ms-transform: rotate(-5deg); }
100% { -ms-transform: rotate(0deg); }
}
@keyframes swing {
0% { transform: rotate(0deg); }
25% { transform: rotate(5deg); }
50% { transform: rotate(0deg); }
75% { transform: rotate(-5deg); }
100% { transform: rotate(0deg); }
}

/* ---------------------------------- */

body.home .sec_01{
	background: url(./img/home/bk_pic_1.jpg) no-repeat center top;
	position:relative;
}

body.home .sec_01 .swing{
	position:absolute;
	top:50px;
	left:10%;
}

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

	body.home .sec_01 .swing{
		left:-250px;
		width:80%;
	}

}

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

	body.home .sec_01 .swing{
		display:none;
	}

}

body.home .sec_02{
	width:100%;
	position:relative;
	padding-top:250px;
}

body.home .sec_02 .swing{
	position:absolute;
	top:0;
	left:50%;
	margin-left:-110px;
}

@media screen and (max-width:639px){
	
	body.home .sec_02 .swing{
		max-width:25%;
		position:absolute;
		top:0;
		left:50%;
		margin-left:-30px;
	}
	
}


body.menu .sec_02 .menu-list li.left img.fixed_pan,
body.menu .sec_02 .menu-list li.right img.fixed_pan{
	position:absolute;
	top:30px;
	left:50px;
	max-width:220px;
}
body.menu .sec_02 .menu-list li.left img.fixed_pan2,
body.menu .sec_02 .menu-list li.right img.fixed_pan2{
	position:absolute;
	top:0;
	right:75px;
	max-width:220px;
}

body.home .sec_02,
body.home .sec_04 .inner h3.sec_title,
body.home .sec_05,
body.menu .sec_02{
	transition: .8s;
}

body.home .sec_07{
	padding-bottom:50px;
	background: url(./img/home/bk_pic_3.png) no-repeat center -110px;
}

@media screen and (max-width:639px){
	
body.home .sec_02{
	padding:80px 0 0 0;
}
	
}

body.home .sec_03{
	position:relative;
	padding:0;
	background:none;
}

@media screen and (max-width:639px){
	
	body.home .sec_03{
		position:relative;
		padding:0;
	}
}

body.home .sec_03 .swing{
	position:absolute;
	top:0;
	left:50%;
	
	margin-left:-111px;
}

body.home .sec_02 ul.list{
	overflow: hidden;
    margin-top: 50px;
    position: relative;
}

body.home .sec_07 ul.list{
	max-width:1000px;
	margin:50px auto 0 auto;
	overflow:hidden;
}

body.home .sec_02 ul.list li,
body.home .sec_07 ul.list li {
    width: 50%;
    box-sizing: border-box;
}



@media screen and (max-width:639px){
	
	body.home .sec_02 ul.list li,
	body.home .sec_07 ul.list li{
		width:100%;
	}

	body.home .sec_07 .inner h2{
		margin:50px auto 0 auto;
	}
	
	body.home .sec_07 ul.list{
		margin:25px auto 0 auto;
	}
	
	body.home .sec_07 ul.list li .fb_iframe_widget{
		margin:0 auto;
	}
	
	
}

body.home .sec_02 ul.list li:nth-child(1),
body.home .sec_07 ul.list li:nth-child(1) {
    float: left;
    width: 480px;
    background: #fff;
}

body.home .sec_02 ul.list li:nth-child(2),
body.home .sec_07 ul.list li:nth-child(2) {
    float: right;
    margin-bottom: 20px;
}

@media screen and (max-width:639px){
	
	body.home .sec_02 ul.list li:nth-child(2),
	body.home .sec_07 ul.list li:nth-child(2){
		margin-top:30px;
	}
	
}

body.home .sec_03 ul.list li:nth-child(1){
	height:auto;
}

/* ---
	リクルートページの上書き
--------------------------------------------------------- */

body.recruit .sec_01{
	padding:0 0 50px;
}

body.recruit .sec_01 .link-box a.link{
	background:#fff;
}

/* ------------------------------------------------------ */

@media screen and (max-width:767px){
	
	body.menu .sec_02 .menu-list li.left img.fixed_pan,
	body.menu .sec_02 .menu-list li.right img.fixed_pan{
		width:40%;
		display:block;
		left:15px;
		max-width:125px;
	}

	body.menu .sec_02 .menu-list li.left img.fixed_pan2,
	body.menu .sec_02 .menu-list li.right img.fixed_pan2{
		width:40%;
		display:block;
		right:15px;
		max-width:125px;
	}
	
	body.home .sec_03 .swing{
		display:none;
	}
	
}

nav#site-nav ul.sub-menu li.current-menu-item a{
	background: url(./img/common/g_navi_line.png) no-repeat center bottom;
}

/* ---
	404ページ
------------------------------------- */

article.not-found h1.not_found{
	text-align:center;
	color:#DD711E;
	font-size:60px;
	font-weight:bold;
}

.not_found .inner{
	padding:50px 0;
}
.not_found .inner p{
	text-align:center;
	line-height:160%;
}
.not_found .inner .btn_notfound{
	padding-top:50px;
}
.not_found .inner .btn_notfound a{
	padding:15px 30px;
	border:1px solid #DD711E;
	color:#DD711E;
	font-weight:bold;
}
.not_found .inner .btn_notfound a:hover{
	color:#fff;
	background:#DD711E;
	border:1px solid #DD711E;
}
}

#sb_instagram .sbi_follow_btn a{
	height:33px;
}

/* お問い合わせ */
body.contact .sec_01 .tb-contact{
	width:100%;
}
body.contact .sec_01 .tb-contact th{
	width:30%;
}
body.contact .sec_01 .tb-contact td{
	width:70%;
}

body.contact .sec_01 .hissu{
	margin-top:5px;
}