@charset "UTF-8";

/*html { font-family: "新丸ゴ M"; font-size: 19px; line-height: 1.5; }　 */

/* Base  */

html { font-family: "Ropa Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif; font-size: 19px; line-height: 1.5; }
body { background-color: rgb(0, 0, 0); color: rgb(0, 0, 0); min-width: 960px; }
h1, h3, p, ul { margin: 0; }
h2 { margin: 0px; }
ul { padding-left: 0; }
ul li { list-style-type: none; }
a { color: inherit; text-decoration: none; }
img { vertical-align: middle; }
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }


/* ------一番上リボタンと６個バナーリンク 色------ */

a {
	outline: none;
}

a:link {
	text-decoration: none;
	color: #fff;
}
a:visited {
	text-decoration: none;
	color: #219dfc;
}
a:hover {
	text-decoration: underline; /* -マウスを乗せたときの色- */
	color: #30a4fd;
}
a:active {
	text-decoration: underline;
	color: #fbca05;
}

/* ------ Article ------ */

article {
	background-color: #fff;
	padding-bottom: 50px;
}


/* ------ Index ------ */　

#index {
	padding-bottom: 20px;
		
}


@media screen and (min-width: 640px) {
	#index {
		background: url(../images/separetor1.png) no-repeat bottom center;
	}
}

#index section a {
	display: block;
	position: relative;
	padding: 10px 0 10px;
	text-decoration: none;
	border: 1px solid #5a5a5a;
}
#index section a:link,
#index section a:visited {
	background-color: transparent;
}
#index section a:hover,
#index section a:active {
	background-color: #333;
}

#index .img {
	margin-bottom: 10px;
}

#index h1 {
	margin-bottom: 3px;
	font-size: 14px;
	font-weight: bold;
	padding-left: 25px;
	color: #01c85f;
}

#index section a:link h1:after,
#index section a:visited h1:after {
	margin-left: 10px;
}
#index section a:hover h1:after,
#index section a:active h1:after {
	margin-left: 10px;
}

#index p {
	color: #d3d3d3;     /*6個バナーの説明文字色*/
	padding-left: 10px;
	padding-right: 7px
}

/* ------ Global Navi ------ */

/* デスクトップ／タブレット用表示では、右寄せで配置 */
#gnav {
	float: right;
	width: 90%;
	}

/* ナビゲーションの各項目は、横並びに配置 */
#gnav li {
	float: left;
	width: 20%;
}

#gnav a {
	display: block;
	position: relative;
	z-index: 960px;
	height: 30px;
	padding-top: 50px;
	font-size: 80%;
	text-decoration: none;
	color: #fff;
	text-align: center;
}
/* 疑似要素にアイコンフォントを指定 */
#gnav a:before {
	display: block;
	position: absolute; 
	width: 100%;
	top: 15px;
	text-align: center;
 	font-size: 30px;
	color: #fff;
}
/* ------ Global Navi ------ */
/*
 * Work section
 */

.work-section {
	background-color: rgb(0, 0, 0);
	border-top: 30px inset rgb(255, 0, 0);　　/*　一番上５ボタン上隙間調整ライン　*/ 
	border-bottom: 2px solid rgb(69, 69, 69);
	position: relative;
    z-index: 10;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}
.no-boxshadow .work-section {
    border-bottom: 1px solid rgb(24, 24, 24);
	
	}
.work-section .section-header {
    background: url(../2016/img/bg-noise.png); 
    line-height: 40px;  /* 6ツリンクボタンの高さ*/
/* text-transform: uppercase; アルファベットの大文字/小文字の表示方法を指定する*/
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
    position: relative;  
}
.no-boxshadow .work-section .section-header {
    border-top: 1px solid rgb(204, 204, 204);
}
.work-section .section-header > .inner {
    margin: auto;
	width: 960px;
    position: relative;
}
.work-section h2 { 
　  float: left;
	margin-left: 30px ; 
	margin-top: 30px ;
	font-size: 50px;
	color:#ffffff;
    font-weight: normal; 
    letter-spacing: 1px;
}

/* タブ リンク左右の白縦線を消す　0pxにして*/
.work-section .tabs-nav {
	margin-top: 20px;  /* 一番上ラインとリンクボタンの間隔*/
	border-left: 0px solid rgb(218, 218, 218);
    float: right;
    letter-spacing: 1px;
    -webkit-box-shadow: inset 0px 0 rgb(255, 255, 255);　
            box-shadow: inset 0px 0 rgb(255, 255, 255);
}
.work-section .tabs-nav li {
	border-right: 0px solid rgb(37, 37, 37);  /*左右の外枠縦棒色*/
    float: left;
    position: relative;
    -webkit-box-shadow: 0px 0 rgb(37, 37, 37);
            box-shadow: 0px 0 rgb(37, 37, 37);
}
.work-section .tabs-nav a {
	display: block;
	outline: none;
	position: relative;
	text-align: center;
	width:120px;       /*左外に寄せる*/
	z-index: 10;
}
.work-section .tabs-nav .ui-tabs-active a {
    color: rgb(255, 255, 255);
}

/* ハイライト */
.work-section .tabs-highlight {
	/*background-color: rgb(212, 0, 0); 一番上の5個リンクしたタケット□色*/ 
    /*border-top: 4px solid rgb(255, 255, 255); 	タケット□の上ボーダーライン*/
　　/*border-bottom: 4px solid rgb(255, 0, 0);  	タケット□の下ボーダーライン*/　
	margin-top: 37px;　　
	height: 70px; 
	position: absolute;
	width: 110px;
}


.work-section .tabs-highlight:after {
    background: url(../img/sprites.png) no-repeat 0 0;
    content: "";
    position: absolute;
    width: 37px;
    height: 19px;
    bottom: -30px; /*リンク▼高さ*/ 
    left: 50%;
    margin-left: 0px;
    z-index: 10;
}

/* パネル */
.work-section .section-body {
	border-top: 5px solid rgb(0, 0, 0);  /* 一番上5ボタンと画像隙間 */
	height: 760px;      /*2000-700img下と９個img間隔*/                
    position: relative;
		
}
.work-section .section-body .image-wrapper {
	height: 700px;
	min-width: 960px;
	overflow: hidden;
	position: absolute;
	width: 100%;
	left: 3px;
	top: 59px;
				
	}
	
.work-section .section-body .image-wrapper img {
	position: absolute;
	left: 50%;
	margin-left: -1000px;
	/*　border: 4px double #f5f2f2;　　top.imgボダー色と太さ */
	 border: 3px solid #f5f2f2;
	height: 688px;
	
	
}

.work-section .section-body .content {
    color: rgb(255, 255, 255);
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.9);
    width: 960px;   /*　昇華ユニフォームリンク左右調整　960pxがセンター数値　 */
    margin: auto;
    position: relative;
	
}
.work-section .section-body .content > .inner {
	position: absolute;
	width: 193px;
	
}
.work-section .section-body #work01 .content > .inner {
	top:10px;
	left:180px;
	width: 650px;
}
.work-section .section-body #work02 .content > .inner {
	top: 10px;
	left:180px;
	width: 650px;
}
.work-section .section-body #work03 .content > .inner {
    top: 10px;
    left:180px;
	width: 650px;
	
	}
.work-section .section-body #work04 .content > .inner {
    top: 10px; 
    left: 180px;
	width: 650px;
}

.work-section .section-body #work05 .content > .inner {
    top: 10px; 
    left: 180px;
	width: 650px;
}

.work-section .section-body #work06 .content > .inner {
    top: 10px; 
    left: 180px;
	width: 650px;
}


.work-section .section-body .title { 
    font-size: 50px;
    font-weight: normal;
    text-transform: uppercase;
}
.work-section .section-body .description {
    font-size: 13px;
    line-height: 1.5;
}
.work-section .section-body .read-more {
    font-size: 15px;
    text-transform: uppercase;
    display: inline-block;
    padding: 0.2em 0.5em;
    margin-top: 0.0em; 
    /*　border: 0px solid;　*/
    letter-spacing: 0px;
	background-color:#034aab;　  /*説明ボタンリンク台の色*/
}
.textshadow .work-section .section-body .read-more {
    -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 0 0 2px rgba(0, 0, 0, 0.5) inset;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 0 0 2px rgba(0, 0, 0, 0.5) inset;
}

/* ------ Page Top ------ */

#page-top {
		/* 1番外側のborder */
	border-bottom: solid 8px #494949;
	padding-top:0px
	
}

#page-top p {
	font-size: 85%;
	border-top: solid 5px #494949;		/* 2番目のborder */
	
}

#page-top a {
	display: block;
	padding-bottom: 5px;
	text-align: center;
	text-decoration: none;
	line-height: 35px;
	color:  #000;
	
}
#page-top a:after {
	font-size: 20px;
	font-weight: normal;
	margin-left: 10px;
	margin-top: 20px;
	color: #000;
}
#page-top a:link,
#page-top a:visited {
	background-color: #fff;
}
#page-top a:hover,
#page-top a:active {
	background-color: #98d1fc;
}


/* ------ Utility ------ */

#utility {
	position: absolute; 			/* PC用の表示ではposition:absoluteとする */
	width: 100%;
	top: 0px;	 				/* top:0としてヘッダー部に移動 */
	height: 40px;				/* 高さは固定とする */
	background-color: #000;
}

#utility .row {
	height: 100%;
}

#country {
	float: right;
}

#country p {
	display: inline-block;
	margin-top: 10px;
	margin-right: 20px;
	padding: 0px  0px 0px 0px;    /* Google 横間隔上右下左指定 */
	color: #999;
	font-weight: bold;
	/* border-left: solid 0px #444; */

}
#country p:first-child {
	border-left: none;
}

#country p img {
	width: 5px;
	height: 20px;
	margin-right: 0px;
}

#country p a {
	display: block;
	width: 4em;
	text-decoration: none;
}



#country p a:after {
	content: "\66";
	font-family: 'icomoon';
	font-size: 10px;
	font-weight: normal;
	color: #38bdbb;
	margin-left: 5px;
}


#country p a:link,
#country p a:visited {
	color: #999;
}
#country p a:hover,
#country p a:active {
	color: #38bdbb;
}

#search {
	float: right;
	width: 179px;
	margin: 9px 0 0 10px;
	padding-left: 11px;
	background-color: #444;
	overflow: hidden;
	-webkit-border-radius: 15px;
	border-radius: 15px;
}

#search input {
	float: left;
	display: block;
	width: 70%;
	height: 22px;
	border: none;
	background-color: transparent;
	color: #fff;
}

#search a {
	float: right;
	display: block;
	width: 30%;
	line-height: 22px;
	color: #fff;
	font-size: 76%;
	text-align: center;
	text-decoration: none;
}
#search a:link,
#search a:visited {
	background-color: #666;
	background: -moz-linear-gradient(top, #888, #666);
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#666));
	background: -webkit-linear-gradient(top, #888, #666);
	background: linear-gradient(to bottom, #888, #666);
}
#search a:hover,
#search a:active {
	background-color: #777;
	background: -moz-linear-gradient(top, #999, #777);
	background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#777));
	background: -webkit-linear-gradient(top, #999, #777);
	background: linear-gradient(to bottom, #999, #777);
}

/* ------ Column ------ */

.one-third {
   font-size: 14px;
     
   }
   

.row {
	max-width: 930px;
	margin: 20px auto;  /* ９個画像枠高さ */ 
	
	}
.row:after {
	content: "";
	display: block;
	clear: both;
}

/* 各カラムを横並びにし、左マージンを設定 */
.col {
	float: left;
	margin-left: 3.2258064515%;
}

/* 左端のカラムの左マージンを削除 */
.col:first-child,
.col.left {margin-left: 0;}

/* カラムの左右を入れ替えるための設定 */
.col.right {
	float: right;
	margin-left: 3.2258064515%;
}

/* 各カラムの幅を％で設定 */
.one-second {width: 48.3870967741%;}
.one-third {width: 31.1827956988%;}
.two-third {width: 100%;}

/* ------ Footer ------ */
footer {
	background-color: #000;
	border-top: 20px inset rgb(2, 95, 166);
	margin-top:　-10px;	
	text-align:center;

	}

footer nav {
	margin: 0px 0px 10px 0px;
	
}

footer nav li {
	display: inline-block;
	padding: 0 5px 0 10px;
	border-left: solid 1px #ddd;
	font-size: 65%;     
}
footer nav li:first-child {
	padding-left: 0;
	border-left: none;
}

footer nav a:link,
footer nav a:visited {
	color: #ebe9e9;
	text-decoration: none;
}
footer nav a:hover,
footer nav a:active {
	color: #ededed;
	text-decoration: underline;
}

#copyright {
	margin-bottom: 35px;
}

#copyright p {
	text-align:center;
	font-size: 65%;
	color: #fff;
}

footer .logo {
	padding-top: 35px;
	text-align: right;
}

footer .logo img {
	width: 72px;
	height: 46px;
}



/*-----------------------------------------------------	*/
/*	for 640px - 979px				*/
/*-----------------------------------------------------	*/

@media screen and (min-width: 640px) and (max-width: 979px) {

	/* ------ Column ------ */

	/* 左右に25pxの余白を設定 */
	.row {
		padding: 0 25px;
	}

}



/*-----------------------------------------------------	*/
/*	for - 639px					*/
/*-----------------------------------------------------	*/

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

	/* ------ Column ------ */

	/* 各カラムの横並びを解除し、縦１列に並べる */
	.col,
	.col.left,
	.col.right {

		float: none;
		width: auto;
		margin-left: 0;
	}


	/* ------ Header ------ */

	header {
		background: #000;
		padding-top: 0;
	}
	header .row:before {
		display: none;
	}

	header .col:first-child {
		height: 90px;
	}

	header h1 {
		margin: 0 auto;
		padding-top: 15px;
	}


	/* ------ Global Navi ------ */

	/* スマートフォン用表示では、横幅いっぱいに配置 */
	#gnav {
		float: none;
		width: 100%;
	}

	#gnav a {
		/*height: 20px;　　　　　　 スマートフォン用表示ウェブフォントぼたん高さ */　
		padding-top: 5px;
		font-size: 68%;
	}

	#gnav a:before {
		top: 10px;
	}


	/* ------ Mainvisual ------ */

	#mainvisual-button {
		height: 5px;     /* スマートフォン用表示3個ボタン高さ */
		padding:　1px 0px　;
		　　
	}

	/* ------ Article ------ */

	article {
		padding-bottom: 0;
	}

	article p {
		font-size: 90%;
	}


	/* ------ Index ------ */

	#index  {
		padding-top: 10px;
		
				
	}

	#index section {
		border-top: solid 1px #eee;
		
	}

	#index section a {
		padding: 15px 20px 15px 15px;
	}
	
	/* ------ \5cは丸右矢スマフォに表示 ------ */	
	
	#index section a:after {
		content: "\5c";
		font-family: 'icomoon';
		font-size: 11px;
		display: block;
		position: absolute;
		width: 10px;
		line-height: 10px;
		top: 50%;
		margin-top: -5px;
		transition-duration: 0.3s;
	}
	#index section a:link:after,
	#index section a:visited:after {
		right: 6px;
	}
	#index section a:hover:after,
	#index section a:active:after {
		right: 3px;
	}

	#index h1:after {
		display: none;
	}

	#index .img {
		margin-bottom: 0px;
	}


	/* ------ News ------ */

	#news {
		margin-top: 0;
		border-bottom: none;
	}

	#news dl a {
		padding: 15px 20px 15px 15px;
	}

	#news dt,
	#news dd {
		font-size: 90%;
	}


	/* ------ Sidebar ------ */

	#sidebar {
		margin-top: 0;
		border-bottom: none;
	}

	#sidebar section a {
		padding: 15px 20px 15px 15px;
	}


	/* ------ Page Top ------ */

	#page-top p {
		font-size: 76%;
	}

	#page-top a {
		line-height: 10px;
	}


	/* ------ Utility ------ */

	#utility {
		position: static;		/* スマートフォン用の表示ではposition:staticとする */
		height: auto;
		padding: 5px 0;
		background-color: #f5f5f5;
		border-bottom: solid 1px #e5e5e5;
	}

	#utility .row {
		height: auto;
	}

	#country {
		float: none;
		width: 100%;
		text-align: center;
	}

	#country p {
		margin-top: 15px;
		color: #666;
		border-left-color: #ddd;
	}

	#country p a:link,
	#country p a:visited {
		color: #666;
	}
	#country p a:hover,
	#country p a:active {
		color: #38bdbb;
	}

	#search {
		float: none;
		width: 40px;
		margin: 0 5px;
		text-align: center;
		background-color: #fff;
		border: solid 1px #e5e5e5;
	}

	#search input {
		width: 40%;
		height: 20px;
		color: #666;
	}

	#search a {
		width: 20%;
		line-height: 20px;
	}


	/* ------ Footer ------ */

	footer {
		border-top: solid 1px #fff;
		
		}

	footer nav {
		margin-top: 5px;
	}

	footer nav ul {
		padding: 0 15px;
		text-align: center;
	}

	#copyright {
		margin-bottom: 0;
		padding: 0 15px;
		text-align: center;
	}

	footer .logo {
		padding: 10px 0 10px;
		text-align: center;
	}