@charset "UTF-8";

/* Reset */
* {
  box-sizing: border-box;
}

ul {list-style:none;}
ul,li {margin:0; padding:0;}
a {color:#000; text-decoration:none; outline:none;}
img {vertical-align:middle;}

p {margin:0 0 1em; line-height:1.8;}
dl,dt,dd {margin:0;}
figure {margin:0;}

/* 見出し */
h1,h2,h3,h4,h5,h6 {margin:0;}

address,caption,em,th {
	font-style:normal;
}

/* Fluid-img */
img {width:100%; height:auto;}


/* --------------------------------------------------
	ベース
-------------------------------------------------- */
html {background-color:#fff; color:#000; font-family:"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; 	font-smoothing: antialiased; line-height:1;}

/* BODY */
body {padding-top:25vw;}
body.fixing-body {position: fixed; width: 100%; height: 100%;}

/* WAPPER */

/* --------------------------------------------------
	共通
-------------------------------------------------- */
/* SP-ONLY,PC-ONLY  */
.pc_only {display:none;}


/* --------------------------------------------------
	ヘッダ
-------------------------------------------------- */
/* ヘッダー */
#header {width:100%; position:fixed; top:0; left:0; background-color:#fff; transition: all 0.25s ease; z-index:100;}
#header .head_parts {padding:6.67vw;}
#header h1 {font-size:1px; width:40vw; margin:0 auto;}
#header .menuOpen {position:absolute; top:10vw; left:8vw; width:8.6vw; cursor:pointer;}

/* メニュートグル＆ハンバーガーアイコン */
.menuOpen {position:absolute; top:10vw; left:8vw; width:8.6vw; cursor:pointer;}
.menuOpen span {display:block;} 
.menuOpen span,.menuOpen span:before,.menuOpen span:after {content:""; position:absolute; width:100%; height:2px; background-color:#333;}
.menuOpen span:before {top:calc(2vw + 2px);}
.menuOpen span:after {top:calc(4vw + 4px);}
.menuOpen img { padding-top:calc(6px + 6vw);}

/* メニュートグル＆クローズアイコン */
.menuClose {position:absolute; top:9vw; left:8vw; width:8.6vw; cursor:pointer;}
.menuClose span {display:block;} 
.menuClose span,.menuClose span:before,.menuClose span:after {width:auto; height:auto; top:0;}
.menuClose span {
width:8.6vw; height:2px; background-color:#fff;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
}
.menuClose span:after {content:""; display:block; width:100%; height:100%; background-color:inherit;
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
}
.menuClose img {padding-top:5vw;}

#header.is-fixed {background-color:rgba(255,255,255,0.95); box-shadow: 0 2px 5px 0 rgba(0,0,0,0.15);}
#header.open {position:fixed; top:0; left:0; height:100%; background-color:#313131; z-index:100;}

/* --------------------------------------------------
	Gナビ
-------------------------------------------------- */
#gNavi {display:none; position:fixed; top:0; left:0; width:100%; height:100%; padding-top:24vw; background-color:#313131; z-index:1000; overflow-y:auto;}
#gNavi ul {border-top:1px solid #666; overflow:hidden;}
#gNavi li {border-bottom:1px solid #666;}
#gNavi li a {display:block; color:#fff; text-align:center; font-size:3.2vw; line-height:1.5; padding:1.8em 0 1.6em;}
#gNavi li a span {display:block; font-size:1.25em;}
#gNavi li.lang {width:50%; float:left;}
#gNavi li.lang:last-child {border-left:1px solid #666;}


/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
#backToTop {position:fixed; right:20px; bottom:20px; width:50px; z-index:90; cursor:pointer; transition: all 0.5s ease;}


/* --------------------------------------------------
	フッター
-------------------------------------------------- */
#footer {background-color:#eee;}
#footer h1 {width:38vw; margin:0 auto; padding:6.7vw 0;}
#footer .pagetop a {display:block; background-color:#d2d2d2; font-size:4.8vw; padding:1em; text-align:center;}
#footer ul {font-size:0; padding-top:10vw;}
#footer li {display:inline-block; width:calc(50% - 10vw); margin:0 0 10vw 10vw; font-size:4.26vw;}
#footer li:before {content:"→"; margin-right:0.2em;}
#footer .copyright {background-color:#d2d2d2; font-size:3.2vw; text-align:center; padding:1em;}


/* --------------------------------------------------
	フォーム関連
-------------------------------------------------- */
p.caution {font-size:0.85em; margin-bottom:1.5em;}
input,textarea {-webkit-appearance: none; background-color:#fff; border-radius:4px; border:1px solid #ccc; font-size:1.142em; width:100%; padding:0.3em 1em;}
::-webkit-input-placeholder {color:#bbb;}
textarea {height:6em;}
input.short {width:30%;}

/* チェックボックス１（角丸） */
.check01 input {display:none;}
.check01 label {position:relative; padding-left:30px; display: inline-block;}
.check01 label:before {display:block; position:absolute; top:0; left:0; width:20px; height:20px; content: ""; border:1px solid #c7c7c7; border-radius:4px; background-color:#fff; cursor: pointer; box-shadow:0 0 4px 0 rgba(0,0,0,0.1);}
.check01 input:checked + label:after {position: absolute; top:1px; left:1px; font-family:FontAwesome; content:"\f00c"; color:#1389bf; font-size:20px; line-height:1;}

/* チェックボックス２（四角） */
.check02 input {display:none;}
.check02 label {position:relative; padding-left:18px; display: inline-block;}
.check02 label:before {display:block; position:absolute; top:3px; left:0; width:12px; height:12px; content: ""; border:1px solid #999; background-color:#fff; cursor: pointer;}
.check02 input:checked + label:after {position: absolute; top:1px; left:0; font-family:FontAwesome; content:"\f00c"; color:#1389bf; font-size:16px; line-height:1;}

/* ラジオボタン */
input[type="radio"] {display:none;}
input[type="radio"] + label {position:relative; padding-left:30px; display: inline-block;}
input[type="radio"] + label:before {display:block; position:absolute; top:0; left:0; width:20px; height:20px; content: ""; border:1px solid #c7c7c7; border-radius:100px; background-color:#fff; cursor: pointer; box-shadow:0 0 4px 0 rgba(0,0,0,0.1);}
input[type="radio"]:checked + label:after {position:absolute; top:3px; left:3px; content:""; display:block; width:16px; height:16px; background-color:#1389bf; border-radius:100px;}
input[type="radio"]:checked + label.pink:after {background-color:#ff5f55;}

/* 送信ボタン１ */
.submit_btn01 {display:block; min-width:70%; background-color:#BCA849; color:#fff; font-size:1.285em; font-weight:bold; border:none; border-radius:5px; line-height:1; padding:0.8em 2em; margin:20px auto;}
.submit_btn01.gray {background-color:#999; color:#fff;}

/* 送信ボタン２ */
.submit_btn02 {display:block; width:100%; background-color:#BCA849; color:#fff; font-size:1.285em; font-weight:bold; border:none; line-height:1; padding:0.8em 2em;}

/* セレクト */
select {height:2em; background-color:#fff; color:#333; border:1px solid #ccc; border-radius:4px; padding:0 30px 0 0.5em;  cursor:pointer;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;	
}
select::-ms-expand { display: none;}
.select_type select {background-image:url(../images/icon_select.png); background-repeat:no-repeat; background-position:right center; background-size:contain;}


/* 必須 */
span.hissu {display:inline-block; background-color:#ff5f55; color:#fff; font-size:10px; font-weight:normal; line-height:1; padding:2px 4px; margin:0 4px;}
span.hissu2 {color:#ff5f55; font-weight:bold;}



/* --------------------------------------------------
	SERVICE
-------------------------------------------------- */
#service {background-image:url(../images/service_bg_sp.png); background-size:100% auto; background-repeat:no-repeat; background-position:center 42vw; padding:10vw 0 13vw;}
#service h2 {width:55vw; margin:0 auto 12vw;}
#service .tablet {width:36vw; margin:0 auto 9vw;}
#service p  {font-size:3.6vw; text-align:center; margin-bottom:21vw;}
#service .chart {width:87vw; margin:0 auto 8vw;}
#service .grucom01 {width:85vw;}
#service .grucom01_btn {width:85vw; margin:-24vw 0 4vw 12vw;}
#service .grucom02_btn {width:86.7vw; margin-top:-9vw;}

/* --------------------------------------------------
	SOLUTION
-------------------------------------------------- */
#solution {background-image:url(../images/solution_bg_sp.jpg); background-repeat:no-repeat; background-size:100% auto; text-align:center; color:#fff; padding:22vw 0 36vw; color:#fff; font-size:3.6vw; text-align:center;}
#solution h2 {width:65vw; margin:0 auto 9.6vw;}
#solution p {margin-bottom:0;}

/* --------------------------------------------------
	NEWS
-------------------------------------------------- */
#news {margin:4.8vw 0 15.5vw;}
#news h2 {width:31vw; margin:0 auto 11vw;}
#news dl {margin:0 2.7vw 14vw;}
#news dt {color:#bca849; font-size:2.8vw; margin-bottom:0.5em;}
#news dd {font-size:3.7vw; line-height:1.5; margin-bottom:2em;}
#news .more_btn a {display:block; width:43vw; font-size:3vw; padding:1em 0; border:1px solid #000; margin:0 auto; text-align:center;}

/* --------------------------------------------------
	NEWS PAGE
-------------------------------------------------- */
#newsPage .pageTitle {width:100vw; height:50vw; background-image:url(../images/newsPage_img_sp.jpg); background-size:cover; background-position:center; background-repeat:no-repeat; margin-bottom:9vw;}
#newsPage .pageTitle h2 {width:31vw; margin:0 auto; padding-top:13vw;}
#newsPage dl {margin:0 2.7vw 14vw;}
#newsPage dt {color:#bca849; font-size:2.8vw; margin-bottom:1em;}
#newsPage dd {font-size:4vw; line-height:1.5; margin-bottom:1em;}

/* --------------------------------------------------
	COMPANY PAGE
-------------------------------------------------- */
#newsPage .pageTitle_profile{width:100vw; height:50vw; background-image:url(../images/companyPage_img_sp.jpg); background-size:cover; background-position:center; background-repeat:no-repeat; margin-bottom:9vw;}
#newsPage .pageTitle_profile h2 {width:50vw; margin:0 auto; padding-top:13vw;}

#newsPage .complead { margin:0 2vw;text-align:center;}
#newsPage .complead p {width:70%;  margin:0 auto;text-align:left;margin-bottom:6vw;}


/* --------------------------------------------------
	CONTACT PAGE
-------------------------------------------------- */
#newsPage .pageTitle_contact{width:100vw; height:50vw; background-image:url(../images/contactPage_img_sp.jpg); background-size:cover; background-position:center; background-repeat:no-repeat; margin-bottom:9vw;}
#newsPage .pageTitle_contact h2 {width:50vw; margin:0 auto; padding-top:13vw;}


/* --------------------------------------------------
	 768px〜　タブレット・PC
-------------------------------------------------- */
@media print, screen and (min-width : 768px) {

/* BODY */
body {padding-top:153px;}
body.fixing-body {position:static; height:auto; top:auto !important;}

/* --------------------------------------------------
	ページトップ
-------------------------------------------------- */
#backToTop {width:65px;}
#backToTop:hover {opacity: 0.75;	filter: alpha(opacity=75); transition: all 0.25s ease;}
	
/* --------------------------------------------------
	共通パーツ
-------------------------------------------------- */
a:hover {color:#bca849; text-decoration:underline;}
a:hover img {opacity: 0.85;	filter: alpha(opacity=75); transition: all 0.25s ease;}

.sp_only {display:none;}
.pc_only {display:block;}



/* --------------------------------------------------
	ヘッダ
-------------------------------------------------- */
/* ヘッダー */
#header .head_parts {padding:20px;}
#header h1 {width:222px;}
#header .lang {position:absolute; top:50px; right:20px; font-size:0;}
#header .lang li {display:inline-block; font-size:14px; font-weight:bold; margin-left:8px;}
#header .lang li:nth-child(2) {font-weight:normal;}
#header .lang li.current a {color:#bca849; text-decoration:underline;}

#header.open {height:auto; background-color:rgba(255,255,255,0.95);}

/* --------------------------------------------------
	Gナビ
-------------------------------------------------- */
#gNavi {display:block !important; position:static; height:auto; padding:16.5px 0; background-color:transparent; border-top:1px solid #d9d1c4;}
#gNavi ul {border:none; font-size:0; text-align:center;}
#gNavi li {border:none; display:inline-block; margin-left:50px;}
#gNavi li:first-child {margin-left:0;}
#gNavi li a {display:inline; color:#000; font-size:14px; padding:0;}
#gNavi li a span,#gNavi li.lang {display:none;}
#gNavi li a:hover,#gNavi li.current a {color:#bca849; text-decoration:underline;}

/* --------------------------------------------------
	フッター
-------------------------------------------------- */
#footer .inner {max-width:950px; margin:0 auto;}
#footer h1 {width:285px; margin:100px 0 0 20px; padding:0; float:left;}
#footer .pagetop {display:none;}
#footer ul {padding-top:70px; width:400px; float:right; overflow:hidden;}
#footer li {display:block; width:200px; margin:0 0 50px; font-size:18px; float:left;}
#footer .copyright {clear:both; font-size:14px;}


/* --------------------------------------------------
	FIRST VIEW
-------------------------------------------------- */
#firstview {background-image:url(../images/firstview_bg.jpg); background-size:cover; background-position:center; position:relative;}
#firstview .catch {max-width:1127px; margin:0 auto;}
#firstview .scroll {position:absolute; bottom:30px; width:100%; text-align:center;}
#firstview .scroll img {width:67px;}

/* --------------------------------------------------
	SERVICE
-------------------------------------------------- */
#service {background-image:url(../images/service_bg_sp.png); background-position:center 300px; padding:100px 0 120px;}
#service h2 {width:274px; margin:0 auto 140px;}
#service .tablet {max-width:271px; margin:0 auto 80px;}
#service p  {font-size:21px; text-align:center; margin-bottom:190px; color:#777}
#service .chart {max-width:1118px; margin:0 auto 150px;}
#service .grucom01_btn {width:100%; margin:-30vw 0 0 0; text-align:right;}
#service .grucom01_btn img {width:60%; max-width:641px;}
#service .grucom02 {text-align:right;}
#service .grucom02 img {width:85vw;}
#service .grucom02_btn {width:100%; margin-top:-50vw;}
#service .grucom02_btn img {width:60%; max-width:664px;}

/* --------------------------------------------------
	SOLUTION
-------------------------------------------------- */
#solution {background-image:url(../images/solution_bg_pc.png); background-repeat:no-repeat; background-size:100% 100%; background-position:center; padding:140px 0 246px; font-size:18px;}
#solution .inner {max-width:1200px; margin:0 auto; background-image:url(../images/solution_img.jpg); background-repeat:no-repeat; background-size:cover; padding:130px 4em 150px; text-align:center;}
#solution h2 {width:324px; margin:0 auto 90px;}
#solution br {display:none;}

/* --------------------------------------------------
	NEWS
-------------------------------------------------- */
#news {max-width:900px; margin:0 auto 120px;}
#news h2 {width:157px; margin:0 auto 80px;}
#news dl {margin:0 20px 50px; overflow:hidden;}
#news dt {font-size:16px; margin-bottom:0; float:left; line-height:1.5;}
#news dd {font-size:18px; margin-bottom:1em; padding-left:7em;}
#news .more_btn a {width:216px; font-size:15px;}
#news .more_btn a:hover {background-color:#bca849; border-color:#bca849; color:#fff; text-decoration:none;}

/* --------------------------------------------------
	NEWS PAGE
-------------------------------------------------- */
#newsPage{ margin: 0 0 120px;}
#newsPage .pageTitle {width:100%; height:376px; background-image:url(../images/newsPage_img_pc.jpg); margin-bottom:120px;}
#newsPage .pageTitle h2 {width:157px; padding-top:126px;}
#newsPage dl {max-width:900px; margin:0 auto ; padding:0 20px; overflow:hidden;}
#newsPage dt {font-size:16px; margin-bottom:0; float:left; line-height:1.5;}
#newsPage dd {font-size:18px; margin-bottom:2em; padding-left:7em;}

/* --------------------------------------------------
	COMPANY PAGE
-------------------------------------------------- */
#newsPage .pageTitle_profile {width:100%; height:376px; background-image:url(../images/companyPage_img_pc.jpg); margin-bottom:120px;}
#newsPage .pageTitle_profile h2 {width:350px; padding-top:126px;}
#newsPage dd ol { margin: 0 0 10px; padding: 0 0 0 20px;}
#newsPage dd ol li { margin: 0 0 10px; list-style-position: outside;}

/* --------------------------------------------------
	CONTACT PAGE
-------------------------------------------------- */
#newsPage .pageTitle_contact {width:100%; height:376px; background-image:url(../images/contactPage_img_pc.jpg); margin-bottom:120px;}
#newsPage .pageTitle_contact h2 {width:350px; padding-top:126px;}

}

/* --------------------------------------------------
	 1200px〜　PC
-------------------------------------------------- */
@media print, screen and (min-width : 1200px) {
	
/* --------------------------------------------------
	ヘッダ
-------------------------------------------------- */
/* ヘッダー */
#header .head_parts {width:1200px; margin:0 auto; position:relative;}
#header .lang {right:100px;}
	
/* --------------------------------------------------
	SERVICE
-------------------------------------------------- */
#service {background-image:url(../images/service_bg_pc.png);}
#service .chart {max-width:1118px; margin:0 auto 150px;}
#service .grucom01 {width:53vw; min-width:850px;}
#service .grucom01_btn {width:1200px; margin:-520px auto 116px;}
#service .grucom02 img {width:60vw; min-width:962px;}
#service .grucom02_btn {width:1200px; margin:-656px auto 192px;}

/* --------------------------------------------------
	SOLUTION
-------------------------------------------------- */
#solution br {display:block;}
#solution br.sp_only {display:none;}


}