@charset "UTF-8";
/*初期化の設定
------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big,
cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol,
ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details,
embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video{
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	margin: 0;
	padding: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
	display: block;
}

body{
	line-height: 1;
}

ol, ul{
	list-style: none;
}

blockquote, q{
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after{
	content: none;
}

table{
	border-collapse: collapse;
	border-spacing: 0;
}

/*基本レイアウト
------------------------------------------------------------------------------*/
/*基本フォント設定
------------------------------------------------------------------------------*/
body{
	position: relative;
	font-size: 14px;
	font-family: 'ヒラギノ角ゴ W3 JIS2004', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'sans-serif';
	line-height: 1.6em;
	color: #2a2a2a;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

/* コンバージョンタグによって生成されるページ下部の隙間解消 */
body > img,
body > iframe{
	display: block;
	height: 0px;
	overflow: hidden;
}

/* /コンバージョンタグによって生成されるページ下部の隙間解消 */
img{
	vertical-align: bottom;
}

br{
	letter-spacing: 0;
}

a{
	color: #000;
	text-decoration: none;
	word-break: break-all;
	word-wrap: break-word;
}

a:hover{
	text-decoration: none;
}

a:focus{
	outline: thin dotted;
}

a:hover, a:active{
	outline: 0;
}

table{
	font-size: inherit;
}

pre, code, kbd, samp, tt{
	font: inherit;
	*font-size: 108%;
	line-height: 100%;
}

strong{
	font-weight: bold;
}

textarea, input{
	font: inherit;
	background:#fffae8;
}

checkbox, input{
	background:#fffae8;
}


h1, h2, h3, h4, h5, h6, strong, th, .Bld{
	font-weight: bold;
	/* font-family: 'ヒラギノ角ゴ W6 JIS2004','ヒラギノ角ゴ Pro W6','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Meiryo','ＭＳ Ｐゴシック','sans-serif' !important;*/
}

button{
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'sans-serif' !important;
}

.under{
	text-decoration: underline;
	color: #008BCC;
}

.under:hover{
	text-decoration: none;
}

p.under{
	color: #000;
}

a.linkno{
	color: #000;
}

.alert-string{
	color: #f00 !important;
}

/*共通の設定
------------------------------------------------------------------------------*/
/*■文字の設定*/
.font10{
	font-size: 71.5% !important;
}

.font11{
	font-size: 78.5% !important;
}

.font12{
	font-size: 86% !important;
}

.font13{
	font-size: 92.8% !important;
}

.font16{
	font-size: 114% !important;
}

.font18{
	font-size: 128.5% !important;
}

.font20{
	font-size: 143% !important;
}

.font22{
	font-size: 157.1% !important;
}

.font24{
	font-size: 171.5% !important;
}

.font26{
	font-size: 186% !important;
}

.font28{
	font-size: 200% !important;
}

.font30{
	font-size: 214.2% !important;
}

.font32{
	font-size: 228.5% !important;
}

.font38{
	font-size: 271.4% !important;
}

.line-h{
	line-height: 1em !important;
}

.line-h12{
	line-height: 1.2em !important;
}

.line-h13{
	line-height: 1.3em !important;
}

.line-h14{
	line-height: 1.4em !important;
}

.line-h15{
	line-height: 1.5em !important;
}

.line-h16{
	line-height: 1.6em !important;
}

.line-h18{
	line-height: 1.8em !important;
}

.line-h20{
	line-height: 2.0em !important;
}

.fontN{
	font-weight: normal !important;
}

.fontB{
	font-weight: bold !important;
}

.clr-red{
	color: #ff1e1e;
}

.clr-key{
	color: #ec6e3c;
}

.clr-blue{
	color: #20209D;
}

.clr-blue--type2{
	color: #1F1F9D;
}

.clr-yellow{
	color: #FFFF00;
}

.clr-green{
	color: #878787;
}

.clr-green--type2{
	color: #444444;
}

.clr-green--type3{
	color: #138A13;
}

/*■配置の設定*/
/*縦位置*/
.vertical-t{
	vertical-align: top !important;
}

.vertical-m{
	vertical-align: middle !important;
}

.vertical-b{
	vertical-align: bottom !important;
}

/*横位置*/
.align-r{
	text-align: right !important;
}

.align-l{
	text-align: left !important;
}

.align-c{
	text-align: center !important;
}

/*■マージン、パディング設定*/
.mg-t5{
	margin-top: 5px !important;
}

.mg-t10{
	margin-top: 10px !important;
}

.mg-t15{
	margin-top: 15px !important;
}

.mg-t20{
	margin-top: 20px !important;
}

.mg-t25{
	margin-top: 25px !important;
}

.mg-t30{
	margin-top: 30px !important;
}

.mg-t35{
	margin-top: 35px !important;
}

.mg-t40{
	margin-top: 40px !important;
}

/*下マージ*/
.mg-b0{
	margin-bottom: 0px !important;
}

.mg-b1{
	margin-bottom: 1px !important;
}

.mg-b3{
	margin-bottom: 3px !important;
}

.mg-b5{
	margin-bottom: 5px !important;
}

.mg-b10{
	margin-bottom: 10px !important;
}

.mg-b15{
	margin-bottom: 15px !important;
}

.mg-b20{
	margin-bottom: 20px !important;
}

.mg-b25{
	margin-bottom: 25px !important;
}

.mg-b30{
	margin-bottom: 30px !important;
}

.mg-b35{
	margin-bottom: 35px !important;
}

.mg-b40{
	margin-bottom: 40px !important;
}

.mg-b45{
	margin-bottom: 45px !important;
}

.mg-b50{
	margin-bottom: 50px !important;
}

.mg-b55{
	margin-bottom: 55px !important;
}

.mg-b60{
	margin-bottom: 60px !important;
}

.mg-b65{
	margin-bottom: 65px !important;
}

.mg-b70{
	margin-bottom: 70px !important;
}

.mg-b75{
	margin-bottom: 75px !important;
}

.mg-b80{
	margin-bottom: 80px !important;
}

.mg-b85{
	margin-bottom: 85px !important;
}

.mg-b90{
	margin-bottom: 90px !important;
}

.mg-b95{
	margin-bottom: 95px !important;
}

.mg-b100{
	margin-bottom: 100px !important;
}

.mg-b150{
	margin-bottom: 150px !important;
}

.mg-b200{
	margin-bottom: 200px !important;
}

/*右マージン*/
.mg-r5{
	margin-right: 5px !important;
}

.mg-r10{
	margin-right: 10px !important;
}

.mg-r15{
	margin-right: 15px !important;
}

.mg-r20{
	margin-right: 20px !important;
}

.mg-r30{
	margin-right: 30px !important;
}

/*左右マージン*/
.mg-r-l5{
	margin-right: 5px !important;
	margin-left: 5px !important;
}

.mg-r-l10{
	margin-right: 10px !important;
	margin-left: 10px !important;
}

.mg-r-l15{
	margin-right: 15px !important;
	margin-left: 15px !important;
}

.mg-r-l20{
	margin-right: 20px !important;
	margin-left: 20px !important;
}

.mg-auto{
	margin: 0 auto;
}

/*全てのマージン*/
.pg{
	padding: 0 10px;
}

.pg-right10{
	padding-right: 10px !important;
}

/*左右パディング*/
.pg-r-l5{
	padding-left: 5px !important;
	padding-right: 5px !important;
}

.pg-r-l10{
	padding-left: 10px !important;
	padding-right: 10px !important;
}

.pg-r-l15{
	padding-left: 15px !important;
	padding-right: 15px !important;
}

.pg-r-l20{
	padding-left: 20px !important;
	padding-right: 20px !important;
}

.pg-r-l30{
	padding-left: 30px !important;
	padding-right: 30px !important;
}

/*上下パディング*/
.pg0{
	padding: 0 !important;
}

.pg-t-b5{
	padding: 5px 0 !important;
}

.pg-t-b10{
	padding: 10px 0 !important;
}

.pg-t-b15{
	padding: 15px 0 !important;
}

.pg-t-b20{
	padding: 20px 0 !important;
}

/*■テキスト装飾設定*/
.f-left{
	float: left !important;
}

.f-right{
	float: right !important;
}

/*■ハック関連*/
/*段落ち回避用ハック*/
.cfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.cfix{
	display: inline-block;
}

/*段落ち回避用ハック*/
.cfixH:after{
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
}

.cfixH{
	display: inline-block;
}

.hidden{
	display: none;
}

.posiR{
	position: relative !important;
}

.posiA{
	position: absolute !important;
}

.font-google{
	font-family: 'Oswald', sans-serif;
}

.font-google2{
	font-family: 'Ropa Sans', sans-serif;
}

/*■テキストリスト*/
ol.list_number > li{
	list-style: decimal outside;
	margin-left: 2em;
	padding: 0 0 0.5em 0;
}

.font-v{
	font-family: 'vijaya', sans-serif !important;
	font-weight: normal !important;
}

.link-under{
	position: relative;
	display: inline-block;
	text-decoration: none;
}

.link-under:after{
	content: '';
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 1px;
	background-color: #333;
	-webkit-transform: scaleX(0);
	-moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-o-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

.link-under:hover:after{
	-webkit-transform: scaleX(1);
	-moz-transform: scaleX(1);
	-ms-transform: scaleX(1);
	-o-transform: scaleX(1);
	transform: scaleX(1);
}

/*レイアウトの設定
------------------------------------------------------------------------------*/
/* ページタイトルh1 */
body > h1{
	width: 1px;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
}

.wrap{
	position: relative;
	width: 980px;
	margin: 0 auto;
}

.wrap2{
	position: relative;
	width: 1200px;
	margin: 0 auto;
}

.hover{
	display: inline-block;
	opacity: 1;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

.hover:hover{
	opacity: 0.6;
}

em{
	font-family: "Abel", sans-serif;
	letter-spacing: 0.1em;
}

.pc{
	display: block;
}

.sp{
	display: none;
}

/*********************************************************************************************
* 共通
*********************************************************************************************/
/*ヘッダー*/
header{
	background: #9fc92f;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 59px;
	z-index: 10000;
}

header .logo{
	position: absolute;
	top: 17px;
	left: 0;
	width: 148px;
	height: 25px;
}

header .logo a{
	background: url(/common/img/header/logo.png) no-repeat;
	background-size: contain;
	display: block;
	height: 25px;
	width: 148px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
}

header .sns{
	left: 790px;
	position: absolute;
	top: 18px;
	width: 100%;
}

header .sns li{
	display: inline-block;
	margin-right: 7px;
}

header .sns li a{
	display: block;
	width: 26px;
	height: 26px;
}

header .sns li a:before{
	font-family: "FontAwesome";
	font-size: 26px;
	color: #fff;
	display: block;
}

/* header .sns li:nth-child(1) a:before{
	content: "\f082";
}*/

header .sns li:nth-child(1) a:before{
	content: "\f16d";
}

header .sns li:nth-child(2) a:before{
	content: "\f099";
}

header .sns li:nth-child(3) a:before{
	content: "\f167";
}

header .sns li a span{
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-indent: 100%;
	height: 0;
}

header #menu-button{
	background: url(/common/img/header/menu.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 12px;
	right: 0;
	width: 32px;
	height: 33px;
	cursor: pointer;
}

header nav{
	background: rgba(0, 0, 0, 0.9);
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	overflow: auto;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	-webkit-overflow-scrolling: touch;
	z-index: 201;
	opacity: 0;
	display: none;
}

header nav:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 59px;
	left: 0;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

header nav:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 428px;
	left: 0;
	background: url(/common/img/border-bg.png) 4px bottom repeat-x;
}

header nav .header{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 1;
}

header nav .header .wrap{
	height: 59px;
}

header nav .header .wrap #menu-close{
	background: url(/common/img/header/menu-off.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 16px;
	right: 0;
	width: 27px;
	height: 27px;
	cursor: pointer;
}

header nav .header .wrap #menu-gotop{
	color: #fff;
	display: block;
	font-size: 171.42857%;
	line-height: 1em;
	font-family: "Abel", sans-serif;
	letter-spacing: 0.1em;
	position: absolute;
	top: 16px;
}

header nav .header .wrap #menu-gotop i{
	margin-right: 5px;
}

header nav.block{
	display: block;
}

header nav.active{
	opacity: 1;
}

header nav > ul{
	display: table;
	position: relative;
	width: 980px;
	margin: 99px auto 0;
	letter-spacing: -0.4em;
	border-left: 1px dashed #707070;
}

header nav > ul > li{
	display: table-cell;
	position: relative;
	padding: 20px 50px;
	text-align: center;
	width: 33.33%;
	vertical-align: top;
	letter-spacing: normal;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border-right: 1px dashed #707070;
}

header nav > ul > li h3{
	font-size: 257.14286%;
	line-height: 1em;
	font-weight: normal;
	color: #9fc92f;
}

header nav > ul > li h3 a{
	color: #9fc92f;
}

header nav > ul > li h3 + h3{
	margin-top: 40px;
}

header nav > ul > li ul{
	margin-top: 36px;
}

header nav > ul > li ul li{
	margin-bottom: 10px;
}

header nav > ul > li ul li:last-child{
	margin-bottom: 0px;
}

header nav > ul > li ul a{
	display: block !important;
	min-height: 34px;
	font-size: 114.28571%;
	line-height: 1em;
	line-height: 34px;
	padding-left: 50px;
	text-align: left;
	color: #fff;
}

header nav > ul > li:nth-child(1) li:nth-child(1) a{
	background: url(/img/about1.png) left center no-repeat;
	background-size: 34px;
}

header nav > ul > li:nth-child(1) li:nth-child(2) a{
	background: url(/img/about2.png) left center no-repeat;
	background-size: 34px;
}

header nav > ul > li:nth-child(1) li:nth-child(3) a{
	background: url(/img/about3.png) left center no-repeat;
	background-size: 34px;
}

header nav > ul > li:nth-child(2) li:nth-child(1) a{
	background: url(/img/products1.png) left center no-repeat;
	background-size: 34px;
}

header nav > ul > li:nth-child(2) li:nth-child(2) a{
	background: url(/img/products2.png) left center no-repeat;
	background-size: 34px;
	/*line-height: 1.4em !important;*/
}

header nav > ul > li:nth-child(2) li:nth-child(3) a{
	background: url(/img/products3.png) left center no-repeat;
	background-size: 34px;
}

header nav > ul > li:nth-child(2) li:nth-child(4) a{
	background: url(/img/products4.png) left center no-repeat;
	background-size: 34px;
}

header nav .sns{
	display: none;
}

.line{
	position: relative;
	background: url(/common/img/line.png) center center repeat;
	padding: 230px 0;
	text-align: center;
}

.line:before{
	background: url(/common/img/dotted-bg2.png) left top repeat;
	content: "";
	width: 100%;
	height: 308px;
	position: absolute;
	top: 160px;
	left: 0px;
}

.line:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

.line a{
	position: relative;
	margin-right:20px;
}

/*フッター*/
footer{
	position: relative;
}

footer:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: -1px;
	left: 0;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

footer:after{
	background: url(/common/img/footer/bg.png) no-repeat 48% 0;
	background-size: 1117px;
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: -30px;
	left: 0;
	height: -webkit-calc(100% + 30px);
	height: calc(100% + 30px);
	margin-left: 0;
	z-index: 1;
}

footer .wrap{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 290px;
	padding: 25px 0;
	position: relative;
	z-index: 2;
}

footer .wrap nav ul{
	letter-spacing: -0.4em;
	margin-bottom: 10px;
	position: absolute;
	right: 0;
	top: 25px;
}

footer .wrap nav ul li{
	position: relative;
	display: inline-block;
	letter-spacing: normal;
	margin-right: 20px;
	line-height: 16px;
}

footer .wrap nav ul li:before{
	font-family: "FontAwesome";
	line-height: 16px;
	margin-right: 5px;
}

footer .wrap nav ul li:nth-child(1):before{
	content: "\f023";
	font-size: 16px;
}

footer .wrap nav ul li:nth-child(2):before{
	content: "\f0e0";
	font-size: 14px;
}

footer .wrap .company-info{
	font-size: 85.71429%;
	line-height: 1.8em;
	margin-bottom: 15px;
}

footer .wrap .sns{
	display: none;
}

footer .wrap #copyright{
	bottom: 25px;
	font-size: 85.71429%;
	line-height: 1em;
	position: absolute;
}

footer .wrap #pmark{
	bottom: 60px;
	position: absolute;
}

footer .wrap #pmark a{
	display: inline-block;
	background: url("/common/img/footer/pmark.png") no-repeat 0 0;
	width: 75px;
	height: 76px;
	white-space: nowrap;
	overflow: hidden;
	text-indent: 100%;
}

.footer-contact {
    background: url(/about/partner/img/lower-form-bg.png) repeat-x 50% 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 300px;
    padding-top: 50px;
    position: relative;
    text-align: center;
}

.footer-contact > .wrap > a {
    background: url(/about/partner/img/job-apply-btn-bg.jpg) no-repeat 0 0;
    background-size: cover;
    border: 10px solid #fff;
    color: #610047;
    display: block;
    font-size: 171.42857%;
    line-height: 78px;
    font-weight: bold;
    height: 78px;
    left: 50%;
    overflow: hidden;
    position: absolute;
    text-align: center;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 536px;
}

.footer-contact:after {
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    top: 0px;
    left: 0px;
    background: url(/common/img/border-bg.png) 4px top repeat-x;
}

.footer-contact > span {
    font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
    font-weight: bold;
    color:#ffffff;
    font-size:20px;
    display: inline-block;
    height: 60px;
    margin-bottom: 80px;
    padding-left: 35px;
    position: relative;
    width: 450px;
    line-height: 30px;
}



/* フェードイン */
#fadein{
	background: #9fc92f;
	color: #fff;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10001;
}

#fadein div{
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/*ページTOPへ*/
#pagetop{
	position: fixed;
	right: 0px;
	bottom: 0px;
	-ms-filter: alpha(opacity=0);
	filter: alpha(opacity=0);
	opacity: 0;
	-webkit-transition: opacity 0.5s ease;
	-moz-transition: opacity 0.5s ease;
	-ms-transition: opacity 0.5s ease;
	-o-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
	width: 68px;
	height: 68px;
	overflow: hidden;
	z-index: 200;
}

#pagetop.open{
	-ms-filter: alpha(opacity=100);
	filter: alpha(opacity=100);
	opacity: 1;
}

#pagetop a{
	position: absolute;
	top: 68px;
	left: 0px;
	background: #9fc92f;
	display: block;
	width: 68px;
	height: 68px;
	text-align: center;
	color: #fff;
	font-size: 128.57143%;
	line-height: 1em;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

#pagetop.open a{
	top: 0px;
}

#pagetop.open a:after{
	content: "";
	width: 15px;
	height: 15px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -5px 0 0 -9px;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

/*タイトル*/
.headline{
	text-align: center;
}

.headline em{
	display: block;
	font-size: 357.14286%;
	line-height: 1em;
	margin-bottom: 5px;
	color: #2a2a2a;
}

.headline span{
	display: block;
	font-size: 85.71429%;
	line-height: 1em;
	color: #9fc92f;
}

/*共通タイトル*/
.headline-box{
	position: relative;
	background: #000;
	padding: 130px 0 93px;
	text-align: center;
	color: #fff;
}

.headline-box:before{
	background: url(/common/img/dotted-bg1.jpg) left -5px repeat;
	content: "";
	width: 100%;
	height: 142px;
	position: absolute;
	top: 0px;
	left: 0px;
}

.headline-box figure{
	height: 56px;
	position: relative;
	width: 56px;
	margin: 0 auto 40px;
	border-radius: 28px;
	overflow: hidden;
}

.headline-box figure img{
	width: 100%;
}

.headline-box h2{
	font-size: 230%;
	line-height: 1em;
	font-weight: normal;
	margin-bottom: 15px;
}

.headline-box p{
	font-size: 90%;
	line-height: 1.6em;
}

/*記事一覧*/
.article-list{
	position: relative;
	letter-spacing: -0.4em;
}

.article-list .bx-wrapper .bx-viewport{
	background: transparent;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-ms-box-shadow: none;
	-o-box-shadow: none;
	box-shadow: none;
	border: none;
	left: 0px;
}

.article-list .bx-wrapper .bx-controls{
	display: none;
}

.article-list article{
	margin-top: 2px;
	display: inline-block;
	width: 296px;
	letter-spacing: normal;
}

.article-list article:nth-child(2){
	margin: 0 48px;
}

.article-list article a{
	display: block;
	padding: 0 2px;
}

.article-list article .thumb{
	position: relative;
	width: 290px;
	height: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
	margin-bottom: 10px;

	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
}

.article-list article .thumb:before{
	background: #fff;
	position: absolute;
	top: -3px;
	left: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

.article-list article .thumb:after{
	background: #fff;
	position: absolute;
	top: -3px;
	right: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

.article-list article .thumb figure:before{
	background: #fff;
	position: absolute;
	bottom: -3px;
	left: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

.article-list article .thumb figure:after{
	background: #fff;
	position: absolute;
	bottom: -3px;
	right: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

.article-list article .thumb figure{
	display: block;
	overflow: hidden;
	height: 163px;
	width: 288px;

}

.article-list article .thumb figure img{
	width: 100%;

}

.article-list article p{
	font-size: 85.71429%;
	line-height: 1em;
	margin-bottom: 8px;
}

.article-list article time{
	display: block;
}

.article-list article time span{
	display: inline-block;
	font-family: "Abel", sans-serif;
	font-size: 214.28571%;
	line-height: 0.9em;
	color: #9fc92f;
	vertical-align: bottom;
	margin: 0px 10px 0 0px;
}

.article-list article time em{
	display: inline-block;
	font-size: 128.57143%;
	line-height: 1em;
	color: #fb0404;
	vertical-align: bottom;
	padding-bottom: 2px;
}

.article-list article .title{
	position: relative;
	background: #9fc92f;
	padding: 0 0.5em;
	margin-top: -4px;
	font-size: 128.57143%;
	line-height: 1.4em;
	font-weight: normal;
	color: #fff;
	max-height: 2.8em;
	overflow: hidden;
}

.article-list article .title:after{
	background: #f8f2da;
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 1.4em;
	left: 0px;
}

.article-list article ul.viewer{
	margin-top: 7px;
}

.article-list article ul.viewer li{
	display: inline-block;
	margin-right: 21px;
}

.article-list article ul.viewer li.view{
	background: url(/common/img/icon-view.png) left 3px no-repeat;
	padding-left: 30px;
	font-family: "Abel", sans-serif;
	font-size: 114.28571%;
	line-height: 1.2em;
	vertical-align: bottom;
}

.article-list article ul.viewer li.good{
	background: url(/common/img/icon-good.png) left top no-repeat;
	padding-left: 25px;
	font-family: "Abel", sans-serif;
	font-size: 114.28571%;
	line-height: 1.2em;
	vertical-align: bottom;
}

.article-list__prev{
	background: url(/common/img/bx-prev.png) no-repeat;
	width: 127px;
	height: 136px;
	margin-top: -80px;
	position: absolute;
	top: 50%;
	left: 0px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
}

.article-list__next{
	background: url(/common/img/bx-next.png) no-repeat;
	width: 127px;
	height: 136px;
	margin-top: -80px;
	position: absolute;
	top: 50%;
	right: 0px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
}

/* 関連サービス一覧 */
ul.related-service{
	text-align: center;
}

ul.related-service > li{
	background-color: #fff;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	height: 153px;
	margin-bottom: 33px;
	margin-left: 50px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 283px;
}

ul.related-service > li.hover:hover{
	opacity: 1;
}

ul.related-service > li.logo-apache, ul.related-service > li.logo-apache > a{
	background: url("/common/img/logo-apache.png") no-repeat 0 0;
}

ul.related-service > li.logo-aws, ul.related-service > li.logo-aws > a{
	background: url("/common/img/logo-aws.png") no-repeat 0 0;
}

ul.related-service > li.logo-bitbucket, ul.related-service > li.logo-bitbucket > a{
	background: url("/common/img/logo-bitbucket.png") no-repeat 0 0;
}

ul.related-service > li.logo-blank, ul.related-service > li.logo-blank > a{
	background: url("/common/img/logo-blank.png") no-repeat 0 0;
}

ul.related-service > li.logo-cacoo, ul.related-service > li.logo-cacoo > a{
	background: url("/common/img/logo-cacoo.png") no-repeat 0 0;
}

ul.related-service > li.logo-chatwork, ul.related-service > li.logo-chatwork > a{
	background: url("/common/img/logo-chatwork.png") no-repeat 0 0;
}

ul.related-service > li.logo-css3, ul.related-service > li.logo-css3 > a{
	background: url("/common/img/logo-css3.png") no-repeat 0 0;
}

ul.related-service > li.logo-eccube, ul.related-service > li.logo-eccube > a{
	background: url("/common/img/logo-eccube.png") no-repeat 0 0;
}

ul.related-service > li.logo-html5, ul.related-service > li.logo-html5 > a{
	background: url("/common/img/logo-html5.png") no-repeat 0 0;
}

ul.related-service > li.logo-javascript, ul.related-service > li.logo-javascript > a{
	background: url("/common/img/logo-javascript.png") no-repeat 0 0;
}

ul.related-service > li.logo-jquery, ul.related-service > li.logo-jquery > a{
	background: url("/common/img/logo-jquery.png") no-repeat 0 0;
}

ul.related-service > li.logo-sass, ul.related-service > li.logo-sass > a{
	background: url("/common/img/logo-sass.png") no-repeat 0 0;
}

ul.related-service > li.logo-ga, ul.related-service > li.logo-ga > a{
	background: url("/common/img/logo-ga.png") no-repeat 0 0;
}

ul.related-service > li.logo-fb, ul.related-service > li.logo-fb > a{
	background: url("/common/img/logo-fb.png") no-repeat 0 0;
}

ul.related-service > li.logo-twitter, ul.related-service > li.logo-twitter > a{
	background: url("/common/img/logo-twitter.png") no-repeat 0 0;
}

ul.related-service > li.logo-ig, ul.related-service > li.logo-ig > a{
	background: url("/common/img/logo-ig.png") no-repeat 0 0;
}

ul.related-service > li.logo-vine, ul.related-service > li.logo-vine > a{
	background: url("/common/img/logo-vine.png") no-repeat 0 0;
}

ul.related-service > li.logo-yt, ul.related-service > li.logo-yt > a{
	background: url("/common/img/logo-yt.png") no-repeat 0 0;
}

ul.related-service > li.logo-linux, ul.related-service > li.logo-linux > a{
	background: url("/common/img/logo-linux.png") no-repeat 0 0;
}

ul.related-service > li.logo-movabletype, ul.related-service > li.logo-movabletype > a{
	background: url("/common/img/logo-movabletype.png") no-repeat 0 0;
}

ul.related-service > li.logo-mysql, ul.related-service > li.logo-mysql > a{
	background: url("/common/img/logo-mysql.png") no-repeat 0 0;
}

ul.related-service > li.logo-php, ul.related-service > li.logo-php > a{
	background: url("/common/img/logo-php.png") no-repeat 0 0;
}

ul.related-service > li.logo-redmine, ul.related-service > li.logo-redmine > a{
	background: url("/common/img/logo-redmine.png") no-repeat 0 0;
}

ul.related-service > li.logo-skype, ul.related-service > li.logo-skype > a{
	background: url("/common/img/logo-skype.png") no-repeat 0 0;
}

ul.related-service > li.logo-wordpress, ul.related-service > li.logo-wordpress > a{
	background: url("/common/img/logo-wordpress.png") no-repeat 0 0;
}

ul.related-service > li.init{
	background-image: none;
	text-indent: 0;
}

ul.related-service > li:nth-child(3n+1){
	margin-left: 0;
}

ul.related-service > li > a{
	display: block;
	height: 153px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 283px;
}

/* サービスアイテム一覧 */
ul.service-item{
	overflow: hidden;
	position: relative;
}

ul.service-item > li{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	font-size: 114.28571%;
	line-height: 1em;
	height: 60px;
	margin: 0 0 15px 52px;
	padding: 3px;
	position: relative;
	width: 286px;
}

ul.service-item > li:nth-of-type(3n+1){
	margin-left: 0;
}

ul.service-item > li:before, ul.service-item > li:after, ul.service-item > li > div:before, ul.service-item > li > div:after{
	background: #fff;
	border: 1px solid #01ffff;
	content: "";
	display: block;
	height: 5px;
	position: absolute;
	width: 5px;
}

ul.service-item > li:before{
	left: 0;
	top: 0;
}

ul.service-item > li:after{
	right: 0;
	top: 0;
}

ul.service-item > li > div{
	border: 1px solid #01ffff;
	height: 60px;
	line-height: 60px;
	text-align: center;
}

ul.service-item > li > div:before{
	bottom: -7px;
	left: 0;
	z-index: 1;
}

ul.service-item > li > div:after{
	bottom: -7px;
	right: 0;
	z-index: 1;
}

/*********************************************************************************************
* TOPページ
*********************************************************************************************/
#index header{
	background: transparent;
	height: 92px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#index header .logo{
	position: absolute;
	top: 30px;
	left: 0;
	width: 191px;
	height: 31px;
}

#index header .logo a{
	background: url(/common/img/header/logo.png) no-repeat;
	background-size: contain;
	display: block;
	width: 191px;
	height: 31px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
}

#index header .sns{
	left: 770px;
	top: 40px;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	width: 100%;
}

#index header .sns li{
	margin-right: 10px;
}

#index header #menu-button{
	background: url(/common/img/header/menu.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 30px;
	right: 0;
	width: 43px;
	height: 44px;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

#index header nav:before{
	top: 92px;
	-webkit-transition: top .3s;
	-moz-transition: top .3s;
	-ms-transition: top .3s;
	-o-transition: top .3s;
	transition: top .3s;
}

#index header nav:after{
	top: 460px;
	-webkit-transition: top .3s;
	-moz-transition: top .3s;
	-ms-transition: top .3s;
	-o-transition: top .3s;
	transition: top .3s;
}

#index header nav .header .wrap{
	height: 59px;
	-webkit-transition: height .3s;
	-moz-transition: height .3s;
	-ms-transition: height .3s;
	-o-transition: height .3s;
	transition: height .3s;
}

#index header nav .header .wrap #menu-close{
	top: 34px;
	width: 36px;
	height: 36px;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-ms-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

#index header nav .header .wrap #menu-gotop{
	display: none;
}

#index header nav > ul{
	margin: 132px auto 0;
	-webkit-transition: margin .3s;
	-moz-transition: margin .3s;
	-ms-transition: margin .3s;
	-o-transition: margin .3s;
	transition: margin .3s;
}

#index header.scroll{
	background: #9fc92f;
	height: 59px;
}

#index header.scroll .logo{
	top: 17px;
	width: 148px;
	height: 25px;
}

#index header.scroll .logo a{
	background-size: contain;
	height: 25px;
	width: 148px;
}

#index header.scroll .sns{
	left: 790px;
	top: 18px;
}

#index header.scroll .sns li{
	margin-right: 7px;
}

#index header.scroll #menu-button{
	background-size: contain;
	top: 12px;
	width: 32px;
	height: 33px;
}

#index header.scroll nav:before{
	top: 59px;
}

#index header.scroll nav:after{
	top: 428px;
}

#index header.scroll nav .header .wrap{
	height: 59px;
}

#index header.scroll nav .header .wrap #menu-close{
	background-size: contain;
	top: 16px;
	width: 27px;
	height: 27px;
}

#index header.scroll nav > ul{
	margin: 99px auto 0;
}

#index .visual{
	background: #000 url(/common/img/index/main201904.png) center center no-repeat;
	width: 100%;
	height: 948px;
}
	#index .visual .swiper-slide .pc{
		background-color: #000;
		background-position: center center;
		background-repeat: no-repeat;
		width: 100%;
		height: 948px;
	}
	#index .visual .swiper-slide .sp{
		display: none;
	}

#index .link{
	position: relative;
	background: #000000;
	padding: 45px 0 45px;
}

#index .link li a{
	width:520px;
	margin:0 auto;
	display:block;
}
#index .link .bx-wrapper {
    margin: 0 auto 40px;
	width: 540px;
}
/* デフォルトの周りの枠を表示しない */
#index .link .bx-wrapper .bx-viewport {
  box-shadow: none;
  border: none;
  background: none;
  left: 0;
}

/* ページャーやコントロール（start, stop）の位置の調整 */
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  bottom: -35px;
}
 
/* ページャーのスタイル */
.bx-wrapper .bx-pager.bx-default-pager a {
  background: none;
  border: 2px solid #fff;
  width: 6px;
  height: 6px;
  margin: 0 5px;
  outline: 0;
  -webkit-transition: 0.7s;
  -moz-transition: 0.7s;
  -o-transition: 0.7s;
  transition: 0.7s;
}
 
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: #fff;
}
 
/* Next, Prev は非表示にしておき、jQuery でホバー時に表示 */
.bx-wrapper .bx-controls-direction a {
  display: none;
}
 
/* start, stop のコントロールのスタイルの調整 */
.bx-wrapper .bx-controls-auto .bx-start, .bx-wrapper .bx-controls-auto .bx-stop {
  opacity: .5; 
}
 
/* ページャーを中心に表示するための調整 */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: center;
  width: 100%;
}	

#index .about{
	position: relative;
	background: #000000;
	padding: 45px 0 90px;
}

#index .about:before{
	background: url(/common/img/dotted-bg1.jpg) left top repeat;
	content: "";
	width: 100%;
	height: 308px;
	position: absolute;
	top: 188px;
	left: 0px;
}

#index .about .headline{
	margin-bottom: 120px;
}

#index .about .headline em{
	color: #9fc92f;
}

#index .about .headline span{
	color: #fff;
}

#index .about ul{
	position: relative;
	letter-spacing: -0.4em;
}

#index .about ul li{
	display: inline-block;
	width: 33.33%;
	text-align: center;
	letter-spacing: normal;
}

#index .about ul li figure{
	margin-bottom: 25px;
}

#index .about ul li h3{
	font-size: 214.28571%;
	line-height: 1em;
	font-weight: normal;
	color: #fff;
	margin-bottom: 90px;
}

#index .about ul li p{
	font-size: 100%;
	line-height: 1.8em;
	color: #fff;
}

#index .products{
	position: relative;
	background: url(/common/img/index/products-bg.png) center top repeat;
	padding: 50px 0 165px;
}

#index .products:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#index .products:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#index .products .headline{
	margin-bottom: 120px;
}

#index .products ul{
	position: relative;
	letter-spacing: -0.4em;
}

#index .products ul li{
	display: inline-block;
	width: 25%;
	text-align: center;
	letter-spacing: normal;
	vertical-align: top;
}

#index .products ul li figure{
	position: relative;
	width: 171px;
	height: 171px;
	margin: 0 auto 25px;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
}

#index .products ul li figure:before{
	content: "";
	width: 260px;
	height: 262px;
	position: absolute;
	top: -45px;
	left: -46px;
}

#index .products ul li figure img{
	position: relative;
}

#index .products ul li:nth-child(1) figure:before{
	background: url(/common/img/index/products-list-bg1.png) no-repeat;
}

#index .products ul li:nth-child(2) figure:before{
	background: url(/common/img/index/products-list-bg2.png) no-repeat;
}

#index .products ul li:nth-child(3) figure:before{
	background: url(/common/img/index/products-list-bg3.png) left -5px no-repeat;
}

#index .products ul li:nth-child(4) figure:before{
	background: url(/common/img/index/products-list-bg4.png) no-repeat;
}

#index .products ul li:nth-child(1) a{
	margin-left: -75px;
}

#index .products ul li:nth-child(2) a{
	margin-left: -20px;
}

#index .products ul li:nth-child(3) a{
	margin-right: -20px;
}

#index .products ul li:nth-child(4) a{
	margin-right: -75px;
}

#index .products ul li h3{
	position: relative;
	font-size: 128.57143%;
	line-height: 1.4em;
	font-weight: normal;
}

#index .products > a.home{
	background: url(/common/img/index/products-home.png) no-repeat;
	background-size: 122px;
	position: absolute;
	bottom: -2px;
	left: 50%;
	width: 122px;
	height: 41px;
	margin-left: -61px;
	text-indent: 200%;
	white-space: nowrap;
	overflow: hidden;
}

#index .briccolog{
	position: relative;
	background: url(/common/img/line.png) center center repeat;
	padding: 50px 0 160px;
}

#index .briccolog:before{
	background: url(/common/img/index/blog-flower.png) center top no-repeat;
	content: "";
	width: 1118px;
	height: 472px;
	position: absolute;
	bottom: 0px;
	left: 50%;
	margin-left: -559px;
}

#index .briccolog .headline{
	margin-bottom: 76px;
}

#index .briccolog .briccolog_link{
	max-width: 980px;
	margin: 45px auto 0;
	position: relative;
	z-index: 999;
}
#index .briccolog .briccolog_link p{
	margin: 0 0 0 auto;
	width: 172px;
}
#index .briccolog .briccolog_link p a{
	background: #000;
	color: #fff;
	display: block;
	text-align: center;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-ms-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #000;
	font-size: 92.8%;
	height: 40px;
	line-height: 40px;
	width: 172px;
}


#index .message{
	position: relative;
	background: url(/common/img/index/message-bg3.png) center top repeat;
	width: 100%;
	height: 590px;
	padding: 60px 0 0;
}

#index .message:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#index .message:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#index .message .headline{
	margin-bottom: 140px;
}

#index .message .headline span{
	color: #4ead5e;
}

#index .message p{
	font-size: 142.85714%;
	line-height: 1.4em;
	font-weight: bold;
	text-align: center;
	color: #000;
	margin-bottom: 15px;
}

#index .message a{
	display: block;
	width: 370px;
	margin: 0 auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px;
	border-radius: 15px;
	border: 1px solid #000;
	font-size: 114.28571%;
	line-height: 65px;
	font-weight: bold;
	color: #f7ff01;
	text-align: center;
	background: #000000;
}

#index .news{
	background: url(/common/img/index/news-bg.png) left top repeat;
	padding: 70px 0 180px;
}

#index .news .headline{
	margin-bottom: 67px;
}

#index .news .headline em{
	color: #fdf011;
}

#index .news .headline span{
	color: #fff;
}

#index .news .article-list article time span{
	color: #fff;
}

#index .news .article-list article time em{
	color: #fdf011;
}

#index .news .article-list article .title{
	background: #fff;
	color: #b74a84;
}

#index .news .article-list article .title:after{
	background: #b74a84;
}

/*********************************************************************************************
* 会社について
*********************************************************************************************/
#company .message{
	position: relative;
	background: url(/about/company/img/bg1.jpg) center top repeat;
	padding: 236px 0 250px;
	text-align: center;
}

#company .message:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#company .message p{
	display: block;
	font-size: 128.57143%;
	line-height: 1em;
	text-align: center;
}

#company .message p span{
	display: inline-block;
	background: #fdf011;
	padding: 0.3em 0.2em;
}

#company .member{
	background: url(/about/company/img/bg2.jpg) center top repeat;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	padding: 100px 40px 200px;
	z-index: 2;
}

#company .member:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#company .member:after{
	content: "";
	width: 650px;
	height: 464px;
	position: absolute;
	bottom: -180px;
	left: 50%;
	background: url(/about/company/img/deer.png) no-repeat;
	margin-left: -325px;
}

#company .member ul{
	position: relative;
	letter-spacing: -0.4em;
	text-align: center;
}

#company .member ul li{
	display: inline-block;
	width: 33.33%;
	vertical-align: middle;
	letter-spacing: normal;
	margin-bottom: 90px;
}

#company .member ul li figure{
	width: 58%;
	margin: 0 auto 17px;
}

#company .member ul li p{
	font-size: 100%;
	line-height: 1em;
	font-weight: bold;
	margin-bottom: 10px;
}

#company .member ul li h3{
	font-size: 171.42857%;
	line-height: 1em;
}

#company .info{
	position: relative;
	padding: 235px 40px 60px;
	z-index: 1;
}

#company .info:before{
	content: "";
	width: 1500px;
	height: 164px;
	position: absolute;
	top: 0;
	left: 50%;
	background: url(/about/company/img/bg3.jpg) no-repeat;
	margin-left: -750px;
}

#company .info:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#company .info .wrap{
	overflow: hidden;
}

#company .info .wrap .block{
	float: left;
	width: 50%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 28px 0 0;
}

#company .info .wrap .block:nth-child(2n){
	float: right;
	padding: 0 0 0 28px;
}

#company .info .wrap .block table{
	width: 100%;
	font-size: 85.71429%;
	line-height: 2em;
}

#company .info .wrap .block table tr{
	border-bottom: 1px solid #9fc92f;
}

#company .info .wrap .block table tr:last-child{
	border: none;
}

#company .info .wrap .block table tr th{
	width: 5em;
	padding: 0.5em;
	text-align: left;
}

#company .info .wrap .block table tr td{
	padding: 0.5em;
}

#company .info .wrap .block table tr td a:hover{
	text-decoration: underline;
}

#company .map{
	position: relative;
	padding: 0 0 90px;
}

#company .map:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#company .map #map{
	width: 100%;
	height: 485px;
	margin-bottom: 70px;
}

#company .map #map iframe{
	width: 100%;
	height: 485px;
	pointer-events: none;
}

#company .map p{
	font-size: 100%;
	line-height: 2em;
}

#company .map p:nth-child(2){
	margin-bottom: 2.5em;
}

/*********************************************************************************************
* 私たちの考え
*********************************************************************************************/
#philosophy > section{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
}

#philosophy > section h3{
	font-size: 214.28571%;
	line-height: 1.5em;
	text-align: center;
	padding: 0 0 30px;
}

#philosophy #corporate-philosophy p,
#philosophy #management-philosophy p{
	font-size: 150%;
	line-height: 1.5em;
	text-align: center;
}

#philosophy #corporate-philosophy{
	background: url("/about/philosophy/img/corporate-bg-center.jpg") no-repeat center 1px;
	padding-top: 90px;
}

#philosophy #corporate-philosophy:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0;
	left: 0;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#philosophy #management-philosophy{
	background: url("/about/philosophy/img/management-bg-repeat.jpg") repeat-x center 0;
	height: 850px;
}

#philosophy #management-philosophy:before{
	background: url("/about/philosophy/img/management-bg-center.jpg") no-repeat 0 0;
	content: "";
	display: block;
	height: 850px;
	left: 50%;
	position: absolute;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 860px;
}

#philosophy #management-philosophy > .wrap{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 850px;
	padding-top: 230px;
}

/*#philosophy #management-philosophy h4{
	background-size: cover;
	height: 134px;
	margin: 0 auto 45px;
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	width: 134px;
} */

#philosophy #management-philosophy h4 {
    /* background-size: cover; */
    /* height: 134px; */
    margin: 75px auto 60px;
    /* overflow: hidden; */
    /* text-indent: 100%; */
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    white-space: nowrap;
    /* width: 134px; */
}

#philosophy #action-policy{
	padding-top: 30px;
}

#philosophy #action-policy > .wrap{
	overflow: hidden;
}

#philosophy #action-policy > .wrap > ul{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	overflow: hidden;
	padding-bottom: 100px;
	position: relative;
	width: 50%;
}

#philosophy #action-policy > .wrap > ul > li > h4{
	font-size: 128.57143%;
	line-height: 2em;
}

#philosophy #action-policy > .wrap > ul > li > ul{
	margin-bottom: 25px;
}

#philosophy #action-policy > .wrap > ul > li > ul > li{
	color: #785501;
	font-size: 95%;
	line-height: 2em;
	list-style: disc outside;
	margin-left: 1.5em;
}

#philosophy #spirits{
	background: url("/about/philosophy/img/spirits-bg-repeat.jpg") repeat-x center 0;
	height: 511px;
}

#philosophy #spirits:before{
	background: url("/about/philosophy/img/spirits-bg-center.jpg") no-repeat 0 0;
	content: "";
	display: block;
	height: 510px;
	left: 50%;
	position: absolute;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 980px;
}

/*********************************************************************************************
* パートナー
*********************************************************************************************/
#partner > h3#partner-title{
	background: url("/about/partner/img/partner-title.jpg") no-repeat 50% 33px;
	height: 722px;
	margin: 0;
	overflow: hidden;
	position: relative;
	text-indent: 100%;
	white-space: nowrap;
	width: 100%;
}

#partner > h3#partner-title:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#partner > h3#partner-title:after{
	content: "";
	width: 100%;
	height: 1px;
	background: url(/common/img/border-bg.png) 4px bottom repeat-x;
	bottom: 0;
	left: 0;
	position: absolute;
}

#partner > section{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
}

#partner > #partner-joblist{
	background: url("/about/partner/img/partner-joblist-bg.png") repeat-x;
	min-height: 1000px;
	z-index: 1;
}

#partner > #partner-joblist:before{
	background: url("/about/partner/img/partner-title-bg.png") no-repeat 0 0;
	content: "";
	display: block;
	height: 430px;
	left: 50%;
	position: absolute;
	top: -380px;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	width: 720px;
}

#partner > #partner-joblist > .wrap{
	background: url("/about/partner/img/pig-1.png") no-repeat 610px 165px, url("/about/partner/img/pig-2.png") no-repeat 70px 724px;
}

#partner > #partner-joblist > .wrap > p{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 128.57143%;
	line-height: 2em;
	height: 245px;
	padding-top: 85px;
	text-align: center;
}

#partner > #partner-joblist > .wrap > ul{
	overflow: hidden;
	position: relative;
}

#partner > #partner-joblist > .wrap > ul > li{
	background: rgba(255, 255, 255, 0.8);
	border-style: solid;
	border-width: 1px 1px 0px;
	-moz-border-image: url("/about/partner/img/partner-joblist-border-image.png") 1 1 0 repeat;
	-webkit-border-image: url("/about/partner/img/partner-joblist-border-image.png") 1 1 0 repeat;
	border-image: url("/about/partner/img/partner-joblist-border-image.png") 1 1 0 repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	float: left;
	margin: 0 38px 35px 0;
	width: 301px;
}

/*#partner > #partner-joblist > .wrap > ul > li:not(.spview) {
  height: 562px !important;
}*/
#partner > #partner-joblist > .wrap > ul > li{
	height: 562px;
}

#partner > #partner-joblist > .wrap > ul > li:nth-child(3n){
	margin-right: 0;
}

#partner > #partner-joblist > .wrap > ul > li > .head-box{
	background: url("/about/partner/img/partner-joblist-headbox-bg.png");
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px;
	position: relative;
}

#partner > #partner-joblist > .wrap > ul > li > .head-box > .head-box-heading{
	background: #fff;
	height: 99px;
}

#partner > #partner-joblist > .wrap > ul > li > .head-box > .head-box-heading h4{
	font-size: 128.57143%;
	line-height: 1.5em;
	position: relative;
	text-align: center;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

#partner > #partner-joblist > .wrap > ul > li > .head-box > .head-box-description{
	background: #610047;
	height: 99px;
}

#partner > #partner-joblist > .wrap > ul > li > .head-box > .head-box-description p{
	color: #fff;
	font-size: 92.85714%;
	line-height: 1.5em;
	padding: 0 15px;
	position: relative;
	text-align: center;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

#partner > #partner-joblist > .wrap > ul > li > ul{
	margin: 20px auto 0 auto;
	width: 230px;
}

#partner > #partner-joblist > .wrap > ul > li > ul > li{
	font-size: 100%;
	line-height: 1.2em;
	margin-bottom: 15px;
}

#partner > #partner-apply{
	background: url(/common/img/border-bg.png) repeat-x 4px top, url(/common/img/border-bg.png) repeat-x 4px bottom, url("/about/partner/img/job-apply-bg-0.png") repeat-x 50% 1px, url("/about/partner/img/job-apply-bg-1.png") repeat-x 50% 6px, url("/about/partner/img/job-apply-bg-3.jpg") repeat-x 50% 25px;
}

#partner > #partner-apply > .wrap{
	height: 299px;
	position: relative;
}

#partner > #partner-apply > .wrap:before{
	background: url("/about/partner/img/pig-3.png") no-repeat 0 0;
	content: "";
	display: block;
	height: 363px;
	left: 400px;
	position: absolute;
	top: -141px;
	width: 532px;
}

#partner > #partner-apply > .wrap > a{
	background: url("/about/partner/img/job-apply-btn-bg.jpg") no-repeat 0 0;
	background-size: cover;
	border: 10px solid #fff;
	color: #610047;
	display: block;
	font-size: 171.42857%;
	line-height: 78px;
	font-weight: bold;
	height: 78px;
	left: 50%;
	overflow: hidden;
	position: absolute;
	text-align: center;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 536px;
}

#partner > #partner-ourtools{
	background: url("/common/img/graystripe-bg.png") repeat 0 0;
	padding-bottom: 60px;
}

#partner > #partner-ourtools > .wrap > p{
	font-size: 128.57143%;
	line-height: 2em;
	margin-bottom: 40px;
	padding-top: 85px;
	text-align: center;
}

#partner dl.form-set{
	display: flex;
	flex-wrap: wrap;
	margin-left: 40px;
	position: relative;
	width: 820px;
}
#partner dl.form-set>dt{
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-weight: bold;
	position: relative;
	width: 240px;
}
#partner dl.form-set>dd{
	position: relative;
	width: 580px;
}

#partner #upper-form.contact {
    height: 550px;
}

#partner #upper-form{
	background: url("/about/partner/img/upper-form-bg.jpg") repeat-x 50% 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 490px;
	position: relative;
}

#partner #upper-form h3{
	font-size: 1.6rem;
	height: 170px;
	line-height: 170px;
	text-align: center;
	font-weight: normal;
}
#partner #upper-form dl.form-set>dt{
	color: #fff;
	font-size: 1rem;
	margin-bottom: 20px;
}
#partner #upper-form dl.form-set>dt>label{
	line-height: 40px;
}
#partner #upper-form dl.form-set>dt.required:after{
	content: "必須";
	color: #f00;
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-weight: bold;
	font-size: 0.8rem;
	margin-left: 5px;
}
#partner #upper-form dl.form-set>dd{
	margin-bottom: 20px;
}
#partner #upper-form dl.form-set>dd>input{
	border: 1px solid #e1e1e1;
	border-radius: 5px;
	display: inline-block;
	line-height: 36px;
	padding: 0 0.5em;
	width: 390px;
}
#partner #upper-form p.msg{
	font-size: 1.2rem;
	line-height: 1.6;
	padding-top: 200px;
	text-align: center;
}
#partner #middle-form.contaact{
	padding: 70px 0 0 0;
}

#partner #middle-form{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/*height: 664px;*/
	padding: 70px 0  70px 0;
	position: relative;
}
#partner #middle-form:before{
	background: url("/about/partner/img/middle-form-bg.png") 0 0;
	content: "";
	display: block;
	height: 350px;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}
#partner.contact #middle-form:before{
	height: 300px;
}
#partner #middle-form .wrap:before{
	background: url("/about/partner/img/upper-charm.png") no-repeat 0 bottom;
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: -172px;
	-webkit-transform: translateX(-140px);
	-moz-transform: translateX(-140px);
	-ms-transform: translateX(-140px);
	-o-transform: translateX(-140px);
	transform: translateX(-140px);
	width: 323px;
	height: 140px;
}
#partner #middle-form dl.form-set:nth-of-type(1){
	margin-bottom: 10px;
}
#partner #middle-form dl.form-set.conatct:nth-of-type(2){
	margin-bottom: 70px;
	padding-top: 70px;
}
#partner #middle-form dl.form-set:nth-of-type(2){
	margin-bottom: 70px;
	padding-top: 30px;
}

#partner #middle-form dl.form-set:nth-of-type(2):before{
	background: url("/about/partner/img/form-divider.png") no-repeat left bottom;
	content: "";
	display: block;
	height: 5px;
	left: 0;
	position: absolute;
	top: 0;
	width: 818px;
}
#partner.contact #middle-form dl.form-set:nth-of-type(2):before{
	display: none;
}
#partner #middle-form dl.form-set>dt{
	font-size: 1rem;
	margin-bottom: 20px;
	position: relative;
}
#partner #middle-form dl.form-set:nth-of-type(3)>dt{
	font-size: 0.9rem;
}
#partner #middle-form dl.form-set>dt.required:after{
	content: "必須";
	color: #c12467;
	display: block;
	font-size: 0.8rem;
}
#partner #middle-form dl.form-set>dt>small{
	display: block;
	font-size: 0.7rem;
}
#partner #middle-form dl.form-set>dd.checkboxes{
	display: flex;
}
#partner #middle-form dl.form-set>dd.checkboxes>ul{
	width: 220px;
}
#partner #middle-form dl.form-set>dd>ul>li{
	margin-bottom: 10px;
}
#partner #middle-form dl.form-set>dd>textarea{
	border: 1px solid #e1e1e1;
	border-radius: 5px;
	height: 190px;
	padding: 0.5rem;
	width: 570px;
}
#partner #lower-form.partner{
	background: url("/about/partner/img/job-apply-bg-0.png") repeat-x 50% 1px, 
url("/about/partner/img/job-apply-bg-1.png") repeat-x 50% 6px, 
url("/about/partner/img/job-apply-bg-3.jpg") repeat-x 50% 25px;
}
#partner #lower-form{
	background: url("/about/partner/img/lower-form-bg.png") repeat-x 50% 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 485px;
	padding-top: 140px;
	position: relative;
	text-align: center;
}
#partner #lower-form:before{
	background: url("/about/partner/img/lower-charm.png") no-repeat 0 0;
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: -38px;
	-webkit-transform: translateX(-140px);
	-moz-transform: translateX(-140px);
	-ms-transform: translateX(-140px);
	-o-transform: translateX(-140px);
	transform: translateX(-140px);
	width: 323px;
	height: 148px;
}
#partner #lower-form input[type="checkbox"]{
	display: none;
}
#partner #lower-form input[type="checkbox"]+label{
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-weight: bold;
	display: inline-block;
	height: 30px;
	line-height: 30px;
	margin-bottom: 50px;
	padding-left: 35px;
	background:#ffffff;
	position: relative;
}
#partner #lower-form input[type="checkbox"]+label:before{
	background: #fff;
	border: 5px solid #00bbc0;
	content: "";
	display: block;
	height: 20px;
	left: 0;
	line-height: 20px;
	position: absolute;
	text-align: center;
	top: 0;
	width: 20px;
}
#partner #lower-form input[type="checkbox"]:checked+label:before{
	content: "\f00c";
	font-family: FontAwesome;
}
#partner #lower-form input[type="checkbox"]+label>a{
	color: #00bbc0;
}
#partner #lower-form input[type="submit"]{
	background: url("/about/partner/img/upper-form-bg.jpg") repeat-x 50% 0;
	border: 20px solid #00bbc0;
	color: #610047;
	cursor: pointer;
	display: block;
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-weight: bold;
	font-size: 1.3rem;
	height: 118px;
	margin-left: auto;
	margin-right: auto;
	width: 576px;
}
#partner #lower-result{
	background: url("/about/partner/img/middle-form-bg.png") 0 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	margin-bottom: 80px;
	margin-top: 80px;
}
#partner #lower-result:before{
	background: url("/about/partner/img/upper-charm.png") no-repeat 0 0;
	content: "";
	display: block;
	position: absolute;
	left: 50%;
	top: -215px;
	-webkit-transform: translateX(-140px);
	-moz-transform: translateX(-140px);
	-ms-transform: translateX(-140px);
	-o-transform: translateX(-140px);
	transform: translateX(-140px);
	width: 323px;
	height: 173px;
}
#partner #lower-result>.wrap{
	padding: 120px 0;
}
#partner #lower-result>.wrap>a{
	background: url("/about/partner/img/partner-back-to-top-bg.jpg") no-repeat 50% 50%;
	border: 20px solid #fff;
	color: #285899;
	display: block;
	font-family: 'ヒラギノ角ゴ Pro W6', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-size: 1.4rem;
	font-weight: bold;
	height: 78px;
	line-height: 78px;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	width: 536px;
}


/*********************************************************************************************
* 個人情報保護方針
*********************************************************************************************/
#privacy > section{
	padding: 50px 0;
	position: relative;
}

#privacy > section:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0;
	left: 0;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#privacy > section > .wrap > h3{
	font-size: 171.42857%;
	line-height: 1.6em;
	font-weight: normal;
	margin-bottom: 30px;
	text-align: center;
}

#privacy > section > .wrap > h4{
	border-bottom: 1px solid #86a604;
	color: #86a604;
	font-size: 128.57143%;
	line-height: 1.6em;
	font-weight: normal;
	margin-top: 40px;
	margin-bottom: 25px;
	padding-bottom: 10px;
}

#privacy > section > .wrap > h5{
	font-size: 114.28571%;
	line-height: 1.6em;
	color: #707070;
	font-weight: bold;
	margin-top: 50px;
	margin-bottom: 10px;
}

#privacy > section > .wrap > p{
	font-size: 100%;
	line-height: 1.8em;
	margin-bottom: 1.5em;
}

#privacy > section > .wrap li{
	list-style: disc outside;
	margin-left: 1.5em;
}

#privacy > section > .wrap > dl{
	overflow: hidden;
}

#privacy > section > .wrap > dl > dt, #privacy > section > .wrap > dl > dd{
	margin-bottom: 5px;
}

#privacy > section > .wrap > dl > dt{
	clear: both;
	float: left;
	font-weight: bold;
	margin-right: 5px;
}

#privacy > section > .wrap > dl > dd{
	margin-right: 10px;
}

#privacy > section > .wrap > table{
	border-collapse: separate;
	border-spacing: 2px;
	width: 100%;
}

#privacy > section > .wrap > table > tbody > tr > th, #privacy > section > .wrap > table > tbody > tr > td{
	padding: 5px 10px;
}

#privacy > section > .wrap > table > tbody > tr > th{
	background: #ccc;
	font-weight: normal;
	text-align: center;
}

#privacy > section > .wrap > table > tbody > tr > td{
	background: #ececec;
	padding: 5px 20px 5px 10px;
}

/*********************************************************************************************
* products
*********************************************************************************************/
#products{
	background: url("/common/img/graystripe-bg.png");
	padding-top: 59px;
}

#products > .prod-headline{
	background: url("/products/img/prod-headline-bg.jpg") repeat 50% 50%;
	/*background-size: cover;*/
	position: relative;
}

#products > .prod-headline:after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#products > .prod-headline > .wrap{
	height: 325px;
}

#products > .prod-headline > .wrap > h2{
	font-size: 230%;
	line-height: 1.6;
	font-weight: normal;
	padding-top: 130px;
	text-align: center;
}

#products > .prod-headline > .wrap > p{
	text-align: center;
	font-size: 100%;
	line-height: 1.6;
}

#products > .menu-lineups{
	position: relative;
}

#products > .menu-lineups:before{
	content: url("/common/img/arrow-down-black.png");
	left: 50%;
	position: absolute;
	top: -8px;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
}

#products > .menu-lineups > .wrap{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 640px;
	padding-top: 110px;
}

#products > .menu-lineups > .wrap > h3{
	font-size: 214.28571%;
	line-height: 1.6;
	font-weight: normal;
	margin-bottom: 80px;
	text-align: center;
}

#products > .menu-lineups > .wrap > ul{
	text-align: center;
}

#products > .menu-lineups > .wrap > ul > li{
	display: inline-block;
	width: 230px;
}

#products > .menu-lineups > .wrap > ul > li > a{
	display: block;
}

#products > .menu-lineups > .wrap > ul > li figure{
	text-align: center;
	margin-bottom: 20px;
}

#products > .menu-lineups > .wrap > ul > li figure img{
	height: 169px;
	width: 169px;
}

#products > .menu-lineups > .wrap > ul > li h4.title{
	font-size: 171.42857%;
	line-height: 1.6;
	font-weight: normal;
}

#products > .menu-lineups.menu-lineups-production{
	background: url("/products/production/img/menu-lineups-bg.png");
}

#products > .menu-lineups.menu-lineups-production:before{
	content: url("/common/img/arrow-down-white.png");
}

#products > .menu-lineups.menu-lineups-production > .wrap > h3{
	color: #fff;
}

#products > .menu-lineups.menu-lineups-production > .wrap > ul > li h4.title{
	color: #fff;
}

#products > .menu-lineups.menu-lineups-maintenance{
	background: url("/products/maintenance/img/menu-lineups-bg.png");
}

#products > .menu-lineups.menu-lineups-sns{
	background: url("/products/sns/img/menu-lineups-bg.png");
}

#products > .menu-lineups.menu-lineups-sns > .wrap > h3{
	color: #fff;
}

#products > .menu-lineups.menu-lineups-sns > .wrap > ul > li h4.title{
	color: #fff;
}

#products > .menu-lineups.menu-lineups-building{
	background: url("/products/building/img/menu-lineups-bg.png");
}

#products > .menu-lineups.menu-lineups-building > .wrap > h3{
	color: #fff;
}

#products > .menu-lineups.menu-lineups-building > .wrap > ul > li h4.title{
	color: #fff;
}

#products > .lineup{
	padding-bottom: 50px;
	position: relative;
}

#products > .lineup:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#products > .lineup > .wrap{
	padding-top: 70px;
}

#products > .lineup > .wrap > h3{
	font-size: 230%;
	line-height: 1.8;
	font-weight: normal;
	padding-top: 80px;
	text-align: center;
}

#cms-ec > .wrap > h3{
	background: url("/products/production/img/icon-lineup-0.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#design-ui > .wrap > h3{
	background: url("/products/production/img/icon-lineup-1.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#front-dev > .wrap > h3{
	background: url("/products/production/img/icon-lineup-2.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#webapp-dev > .wrap > h3{
	background: url("/products/production/img/icon-lineup-3.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#renewal > .wrap > h3{
	background: url("/products/maintenance/img/icon-lineup-0.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#maintenance > .wrap > h3{
	background: url("/products/maintenance/img/icon-lineup-1.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#hashtag > .wrap > h3{
	background: url("/products/sns/img/icon-lineup-0.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#youtube > .wrap > h3{
	background: url("/products/sns/img/icon-lineup-1.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#sns-management > .wrap > h3{
	background: url("/products/sns/img/icon-lineup-2.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#shop > .wrap > h3{
	background: url("/products/building/img/icon-lineup-0.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#startup > .wrap > h3{
	background: url("/products/building/img/icon-lineup-1.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#school > .wrap > h3{
	background: url("/products/building/img/icon-lineup-2.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#hospital > .wrap > h3{
	background: url("/products/building/img/icon-lineup-3.png") no-repeat 50% 0;
	background-size: 65px 65px;
}

#products > .lineup > .wrap > p{
	font-size: 150%;
	line-height: 1.5;
	margin: 60px 0;
}

/*********************************************************************************************
* LINE
*********************************************************************************************/
#line{
	background: url(/common/img/line.png) center center repeat;
}

#line .title-box{
	position: relative;
	padding: 230px 0 138px;
}

#line .title-box:before{
	background: url(/common/img/dotted-bg2.png) left top repeat;
	content: "";
	width: 100%;
	height: 319px;
	position: absolute;
	top: 0px;
	left: 0px;
}

#line .title-box figure{
	position: relative;
	text-align: center;
	margin-bottom: 23px;
}

#line .title-box h2{
	font-size: 257.14286%;
	line-height: 1em;
	font-weight: normal;
	text-align: center;
}

#line .block{
	position: relative;
	background: url(/common/img/line-title-bg1.jpg) center top no-repeat;
	padding: 47px 0 220px;
}

#line .block:before{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: url(/common/img/border-bg.png) 4px top repeat-x;
}

#line .block .title{
	font-size: 171.42857%;
	line-height: 1em;
	font-weight: normal;
	text-align: center;
	margin-bottom: 17px;
}

#line .block .box{
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

#line .block .box:before{
	background: #fff;
	position: absolute;
	top: -3px;
	left: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

#line .block .box:after{
	background: #fff;
	position: absolute;
	top: -3px;
	right: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

#line .block .box .inner{
	background: #fff url(/common/img/line-title-bg2.jpg) center -2px no-repeat;
	padding-bottom: 138px;
}

#line .block .box .inner:before{
	background: #fff;
	position: absolute;
	bottom: -3px;
	left: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

#line .block .box .inner:after{
	background: #fff;
	position: absolute;
	bottom: -3px;
	right: -3px;
	content: "";
	width: 5px;
	height: 5px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #01ffff;
}

#line .block .box .inner .name{
	font-size: 85.71429%;
	line-height: 44px;
	text-align: center;
	margin-bottom: 80px;
}

#line .block .box .inner figure{
	text-align: center;
}

#line .block .box .inner figure .pc{
	margin: 0 auto;
}

#line .block .box .inner > a{
	display: block;
	background: url(/common/img/link-bg1.png) no-repeat;
	position: absolute;
	bottom: -85px;
	left: 50%;
	margin-left: -85px;
	width: 171px;
	height: 171px;
}

/***********************************************************************************************************************
* リサイズ	1200px以下から980pxまで
***********************************************************************************************************************/
@media screen and (max-width: 1200px){
	.wrap2{
		width: 100%;
	}
}

@media screen and (max-width: 980px){
	.wrap{
		width: 100%;
	}
}