/*
Theme Name: KS
Theme URI: http://www.website.com
Author: <a href="http://www.website.com">website</a>
Author URI: http://www.website.com
Description: Designed by <a href="http://www.website.com">website</a>.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: white, light
Text Domain: am
*/
@charset "utf-8";
/* ===================================================================

CSS information
 file name  :  default.css
 style info :  リセット及びbody初期設定 (このスタイルシートは基本的に変更しない)
 
=================================================================== */


ol{
counter-reset:number !important; /* 名前を付けたカウンターをリセット */
list-style:none !important; /* olが数字を付けることをキャンセル */
margin:0 !important;
padding:0 !important;
}
ol li{
/* リスト部分は好きに装飾！ */
padding-right: 5px;
}
ol li:before{
/* カウンタ（数字になる部分） */
counter-increment: number !important; /* 任意の名前を付けて！ */
content: counter(number) !important; /* 名前を付けたカウンターを呼び出し */
/* 色を変えたり、背景画像を敷いたり！自由自在！ */
}

/* -----------------------------------------------------------------------------
	0. universal
----------------------------------------------------------------------------- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,
legend,input,textarea,p,blockquote,address,caption,table,th,td,img {
	margin  : 0;
	padding : 0;
	font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'メイリオ', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', HiraKakuPro-W3, Osaka, verdana, arial, sans-serif;
	}

/* -----------------------------------------------------------------------------
	1. html, body, a
----------------------------------------------------------------------------- */

a:link {
	color           : #fff;
	text-decoration : none;
	}
a:visited {
	color           : #fff;
	text-decoration : none;
	}
a:hover {
	color           : #fff;
	text-decoration : none;
	}
a:active {
	}

/* -----------------------------------------------------------------------------
	2. inline elements
----------------------------------------------------------------------------- */

img {
	border         : none;
	vertical-align : bottom;
	line-height    : 0;
	}
embed, object {
	outline        : none;
	}
object {
	vertical-align : middle;
	outline        : none;
	}
address, caption, cite, code, dfn, th, var {
	font-weight    : normal;
	font-style     : normal;
	}
em, strong {
	font-weight    : bold;
	font-style     : normal;
	}
sup {
	vertical-align : text-top;
	}
sub {
	vertical-align : text-bottom;
	}
fieldset {
	border         : none;
	}
input, textarea, select, label {
	font-size      : 100%;
	font-family    : inherit;
	vertical-align : middle;
	}
label {
	cursor         : pointer;
	}
textarea {
	overflow       : auto;
	}


/* -----------------------------------------------------------------------------
	3. block elements
----------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
	font-size    : 100%;
	font-weight  : normal;
	line-height  : 1;
	}
hr {
	display      : none;
	}

q:before, q:after {
	content      : '';
	}
abbr, acronym {
	border       : none;
	font-variant : normal;
	}
ul, ol {
	list-style   : none;
	}
code {
		font-family: "Consolas", "Courier New", monospace;
	}
/* -----------------------------------------------------------------------------
	4. table elements
----------------------------------------------------------------------------- */
table {
	border-collapse : collapse;
	border-spacing  : 0;
	}
caption, th, td {
	text-align      : left;
	vertical-align  : top;
	}

/* -----------------------------------------------------------------------------
	5. html5 elements(not use)
----------------------------------------------------------------------------- */
header, nav, aside, section, article, footer,
address,figure,figcaption,hgroup,hr,legend,menu,summary {
	display : block;
	}

body {
	font        : 13px/1.231 arial,helvetica,clean,sans-serif;
	*font-size  : small; /* for IE */
	*font       : x-small; /* for IE in quirks mode */
	}
select, input, button, textarea {
	font        : 99% arial,helvetica,clean,sans-serif;
	}
table {
	font-size   : inherit;
	font        : 100%;
	}
pre, code, kbd, samp, tt {
	font-family : monospace;
	*font-size  : 108%;
	line-height : 100%;
	}

/* =========================== アプリ開発ページ 2022.09.28 ここから =========================== */

.l-section {
	position: relative;
	margin: 0 auto;
}

.text-center {
	text-align: center !important;
	margin-top: 70px;
	font-size: 24px !important;
}

.text-logo {
	font-weight: bold;
	font-size: 24px;
	margin-bottom: 40px;
	line-height: 1.5em;
}

.image-logo {
	text-align: center;
}

.title-apps {
	margin: 0 auto !important;
	margin-top: 75px !important; 
	margin-bottom: 75px !important;
	text-align: center !important;
	position: relative !important;
}

.title-apps span {
	width: 100%;
	color: #272727;
	font-size: 24px;
	line-height: 32px;
	font-weight: bold;
	left: 50%;
	position: absolute;
	bottom: 0;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.title-apps img.apps {
	max-width: 435px !important;
}

.title-h3 {
	font-size: 24px !important ;
	font-weight: bold !important;
	margin-bottom: 24px !important;
	line-height: 2rem !important;
}

.p-txt {
	line-height: 1.5rem;
	font-size: 16px;
}

.merit-container {
	display: flex;
	margin-top: 70px;
	justify-content: space-between;
}
.merit-img {
	width: 100%;
	margin-right: 50px;
}

.agile-container {
	display: flex;
	flex-direction: row-reverse;
	margin-top: 70px;
	justify-content: space-between;
}

.agile-img {
	width: 100%;
	margin-left: 50px;
	flex-shrink: 0.8;
}

.box-agile {
	background-color: #E8F9E7;
	text-align: center;
	padding: 30px;
	margin-top: 30px;
}

.wht-agile {
	font-size: 20px !important;
	font-weight: bold !important;
	margin-bottom: 24px !important;
	color: #47B53D !important;
	text-align: center !important;
}

.bk-white {
	background-color: #FFF;
	padding: 20px;
}

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

/*=================== 選ばれる理由 ===================*/
.reasons {
	margin-top: 70px;
}

.box-flex {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
	padding: 0 !important;
}


.reason-box {
	width: 25%;
	border: #E8F9E7 5px solid;
	border-radius: 5px;
	padding: 30px 20px;
	list-style: none !important;
}

.illust-img {
	padding: 10px;
}

.title-h5 {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.5rem;
	margin-bottom: 30px;
}

.illust>ul li::before {
	position: absolute;
	top: -0.6em;
	left: 1em;
	color: #47B53D;
	font-family: "Noto Sans", sans-serif;
	font-size: 30px;
	font-weight: bold;
	line-height: 1;
	content: "0" counter(num);
}

.illust>ul li {
	/* -webkit-box-shadow: 0 0 10px rgb(0 0 0 / 10%); */
	position: relative;
	bottom: -30px;
	margin-bottom: 2rem;
	border-radius: 10px;
	/* box-shadow: 0 0 10pxrgba(0, 0, 0, 0.1); */
	counter-increment: num;
}

/*=================== よくある質問 ===================*/

.faq__inner {
	margin: 0 auto;
	margin-top: 50px;
}

.faq {
	margin-top: 70px;
}

.faq_box {
	margin-bottom: 2rem;
	padding-bottom: 2rem;
	border-bottom: #E5E5E5 1px solid;
}

.faq_question {
	display: flex;
	margin-bottom: 1rem;
	justify-content: space-between;
}

._txt {
	padding-top: 0.5rem;
	display: block;
	/* padding-left: 0.5rem; */
	font-size: 16px;
	line-height: 1.5rem;
	width: 944px;
	color: #47B53D; 
	font-weight: bold;
}

.an_txt {
	padding-top: 0.5rem;
	display: block;
	/* padding-left: 0.5rem; */
	font-size: 16px;
	line-height: 1.5rem;
	width: 944px;
}

.faq_question::before{
	content: 'Q';
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	display: flex;
	-webkit-box-pack: center;
	background-color: #47B53D;
	border: #47B53D 3px solid;
	color: #fff;
	font-weight: bold;
	font-family: "Noto Sans", sans-serif;
	width: 2rem;
	height: 2rem;
	border-radius: 8px;
	font-size: 1.25rem;
	margin-right: 1rem;
}

.faq_answer {
	display: flex;
	-webkit-box-pack: justify;
	justify-content: space-between;
}

.faq_answer::before {
	content: 'A';
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	display: flex;
	-webkit-box-pack: center;
	border: #47B53D 3px solid;
	color: #47B53D;
	font-weight: bold;
	font-family: "Noto Sans", sans-serif;
	width: 2rem;
	height: 2rem;
	border-radius: 8px;
	font-size: 1.25rem;
	margin-right: 1rem;
}

/*=================== ご相談の流れ ===================*/

.threebox {
	display: flex;
	justify-content: space-between;
	margin-top: 50px;
}

.flow-box {
	text-align: center;
	border: #E8F9E7 5px solid;
	border-radius: 5px;
	padding: 40px 20px;
	position: relative;
	margin: 0 10px;
}

.column-container {
	color: #ffffff;
	text-align: center;
	font-size: 28px;
	line-height: 60px;
	width: 60px;
	height: 58px;
	border-radius: 50%;
	position: absolute;
	left: calc(50% - 66px/2 + 0.5px);
	top: -36px;
	z-index: 3;
	background: #1DBF0F;
}

.w-image img {
	vertical-align: top;
	border-radius: inherit;
}

.arrow {
	position: absolute !important;
	top: 46% !important;
	right: -34px !important;
}

.flow-title {
	font-weight: bold;
	text-align: center;
	margin-top: 30px !important;
	font-size: 14px !important;
}

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

@media screen and (max-width:480px) {
	.title-apps img.apps {
		max-width: 273px !important;
	}
	.title-apps span{
		bottom: -130px !important;
	}
	.merit-container {
		display: block;
	}
	.agile-container {
		display: block;
	}
	.agile-img {
		margin-left: 0;
	}
	.box-flex {
		display: block;
	}
	.reason-box {
		width: auto;
	}
	.threebox {
		display: block;
	}
	.arrow {
		visibility: hidden;
	}
	.flow-title {
		text-align: center;
	}
	.flow-box {
		margin-bottom: 40px;
	}
}





/* =========================== Development page title =========================== */

.keytitle h2 {
	padding-left: 20%;
	z-index: 100;
	}

	@media screen and (min-width:300px) and (max-width:860px){
		.keytitle h2 {
			top: 80px !important;
			font-size: 30px !important;
			}
	}
/* =========================== Home Page =========================== */

#hp-img-01{
	height: 415px;
	background: url(images/hp-main.jpg) no-repeat center top;
	-moz-background-size: auto 100%;
	background-size: auto 100%;
	-webkit-filter: brightness(40%);
}
#hp-column-01 {
	background-color: #FFF;
}
#hp-column-01 h4{
	font-size: 18px;
}
#hp-column-01 .description{
	float: left;
	width: 52%;
}
#hp-column-01 .graphic{
	float: right;
	width: 45%;
	padding-left: 3%;
}
#hp-column-02 .step-01,.step-02,.step-04,.step-05{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#hp-column-02 .step-03,.step-06{
	width: 32%;
	float: left;
}

#hp-column-02 {
	background-color: #FFF;
}

#hp-column-02 .stage h3 span.txt{
    background: none repeat scroll 0 0 #FFF;
    padding: 0 20px 30px 20px;
	display: inline-block;
}
#hp-column-02 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#hp-column-02 h4{font-size: 18px; margin: 0;}
#hp-column-02 .step-01 h4{background: url(images/h4-icon-01.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}
#hp-column-02 .step-02 h4{background: url(images/h4-icon-02.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}
#hp-column-02 .step-03 h4{background: url(images/h4-icon-03.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}
#hp-column-02 .step-04 h4{background: url(images/h4-icon-04.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}
#hp-column-02 .step-05 h4{background: url(images/h4-icon-05.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}
#hp-column-02 .step-06 h4{background: url(images/h4-icon-06.png) no-repeat 0 5px; padding: 10px 0 15px 70px;}

#hp-column-02 h4 span{
	font-size: 14px;
	display: block;
}
#hp-column-02 ul { padding: 0 !important; }
#hp-column-02 ul li{
	list-style: none;
}
.advantage-01,.advantage-02,.advantage-04,.advantage-05,.advantage-07,.advantage-08{
	width: 32%;
	padding-right: 2%;
	float: left;
}
.advantage-03,.advantage-06,.advantage-09{
	width: 32%;
	float: left;
}

#hp-column-03{
	background-color: #FFF;
}
#hp-column-03 .stage h3 span.txt{
    background: none repeat scroll 0 0 #FFF;
    padding: 0 20px 30px 20px;
	display: inline-block;
}
#hp-column-03 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#hp-column-03 h4{font-size: 18px; margin: 0;}
#hp-column-03 .advantage-01 h4{background: url(images/h4-icon-07.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-02 h4{background: url(images/h4-icon-08.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-03 h4{background: url(images/h4-icon-03.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-04 h4{background: url(images/h4-icon-09.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-05 h4{background: url(images/h4-icon-10.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-06 h4{background: url(images/h4-icon-11.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-07 h4{background: url(images/h4-icon-12.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-08 h4{background: url(images/h4-icon-13.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}
#hp-column-03 .advantage-09 h4{background: url(images/h4-icon-14.png) no-repeat 0 10px; padding: 25px 0 30px 70px;}

#hp-column-03 .hp_bnn {
width: 100%;
height: auto;
margin: 10% 0;
}

#hp-column-03 .graphic_l{
	float: left;
	width: 45%;
}
#hp-column-03 .graphic_r{
	float: right;
	width: 45%;
}


#hp-column-04 {
	background-color: #FFF;
}
#hp-column-03 h4 span{
	font-size: 14px;
}

#hp-column-04 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#hp-column-04 h4{
	font-size: 18px;
}
#hp-column-04 .description{
	float: right;
	width: 52%;
}
#hp-column-04 .graphic{
	float: left;
	width: 45%;
	padding-right: 3%;
}

#hp-column-05 h4{
	font-size: 18px;
	font-weight: bold;
}
#hp-column-05 .stage{
	border: none;
}


	@media screen and (min-width:769px){
		.inner h3 {
			font-size: 30px;
			margin-top: 20px;
			margin-bottom: 10px;
		}
		
		#hp-column-01 {
			width: 1000px;
			margin: 0 auto;
		}
		#hp-column-02 {
			width: 1000px;
			margin: 0 auto;
		}
		#hp-column-03 {
			width: 1000px;
			margin: 0 auto;
		}
		#hp-column-04 {
			width: 1000px;
			margin: 0 auto;
		}
		#hp-column-05 {
			width: 1000px;
			margin: 0 auto;
		}

/* =========================== 会社案内 =========================== */
	div.inner_company{
		width: 1000px;
		padding: 2px 0 0 0;
		margin: 0 auto;
		/*background-image: url(../img/inner_bg.jpg);*/
		background-repeat: repeat-y;
		background-position: top center;
		background-size: 100% auto;
	}
	div.contents{
		width: 100%;
		padding-top: 0;
		letter-spacing: 0.5px;
		margin-bottom: -20px;
	}
	div.container{
		background: #fff;
		font-size: 15px;
		padding: 0 0 100px;
	}
	main.corporate article#main div.inner{
		padding-top: 0;
	}
	div.container dl{		
		border-bottom: 1px dotted #dadada;
		background: #f0f0f0;
    	overflow: hidden;
    	border-left: 1px solid #e0e0e0;
    	text-align: center;
	}
	div.container dt{
		width: 200px;
    	float: left;
    	padding: 30px 0 0;
	}
	div.container dd{
    	width: 744px;
    	float: right;
    	text-align: left;
    	padding: 30px 0 30px 50px;
    	background: #fff;
    	line-height: 2;
	}
	div.container dd p.btn{
		width: 340px;
		position: relative;
		display: inline-block;
		vertical-align: middle;
		margin: 0 0 0 20px;
	}
	div.container .top{
		border-top: 1px dotted #dadada;
	}
	div.accessmap div.map{
		clear: both;
		float: left;
		width: 450px;
		height: 450px;
		margin: 0;
	}
	div.accessmap div.txt{
		float: left;
    	text-align: left;
    	padding: 0 0 0 135px;
    	font-size: 15px;
    	line-height: 2;
    	width: 400px;
	}
	div.accessmap div.txt p.googlemap{
		width: 250px;
		margin: 35px 0 0 0;
		position: relative;
	}
	.btn a:link, .btn a:visited {
		position: relative;
		display: block;
		color: #000000;
		font-size:15px;
		text-align: center;
		text-decoration: none;
		overflow: hidden;
		letter-spacing: 0.5px;
		line-height: 1;
		border-radius: 0;
		-webkit-transition: all 1s ease;
		transition: all 1s ease;
	}
	.btn a:link:after, .btn a:visited:after {
		content: "";
		position: absolute;
		height: 0%;
		left: 50%;
		top: 50%;
		width: 150%;
		z-index: -1;
		-webkit-transition: all 0.75s ease 0s;
		transition: all 0.75s ease 0s;
	}
	.btn a:link:hover, .btn a:visited:hover {
		color: #ffffff;
		text-shadow: none;
	}
	.btn a:link:hover:after, .btn a:visited:hover:after {
		height: 450%;
	}

	.btn a {
		color: #000000;
		cursor: pointer;
		display: block;
		position: relative;
		transition: all 0.2s cubic-bezier(0.42, 0, 0.58, 1);
		}
	.btn a:hover {
		color: #ffffff !important;
		background-color: transparent;
	}
	.btn a:hover:before {
		left: 0%;
		right: auto;
		width: 100%;
	}
	.btn a:before {
		display: block;
		position: absolute;
		top: 0px;
		right: 0px;
		height: 100%;
		width: 0px;
		z-index: -1;
		content: '';
		color: #000000 !important;
		background: #000000;
		transition: all 0.2s cubic-bezier(0.42, 0, 0.58, 1);
	}

	.btn a{
		/*display: inline-block;*/
		/*background-color: #ffffff;*/
		border: 1px solid #000000;
		padding: 9px 0;
		}
		body.js_isIe .btn a{
			padding: 12px 0 6px 0;
		}
	.btn a span{
		position: absolute;
		top: 8px;
		right: 30px;
		-webkit-transform: scale(0.5,1);
		transform: scale(0.5,1);
		}
		body.js_isIe .btn a span{
			top: 11px;
		}


	}


	@media screen and (min-width:420px) and (max-width:860px){
		#hp-img-01{height: 355px;}
		.stage{width: auto; margin: 0 auto; padding:0 20px 50px 20px;}
		.stage h3{padding:30px 0;}
		.stage h3 span.bg{
			background: url(images/bg-line.gif) repeat-x scroll center 50% rgba(0, 0, 0, 0);
			padding: 0 30px;
			display: inline-block;
		}
		.stage h3 span.txt{
		    background: none repeat scroll 0 0 #FFF;
		    padding: 0 10px 30px 10px;
			display: inline-block;
		}
		.stage h3 span.br{
			display: block;
		}
		#hp-column-01 {width:auto;}
		#hp-column-02 {width:auto;}
		#hp-column-03 {width:auto;}
		#hp-column-04 {width:auto;}
		#hp-column-05 {width:auto;}
		#hp-column-01 .graphic{
			width: 100%;
			text-align: center;
		}
		#hp-column-01 .description{
			width: 100%;
			margin-top: 30px;
		}
		#hp-column-04 .graphic{
			width: 100%;
			text-align: center;
		}
		#hp-column-04 .description{
			width: 100%;
			margin-top: 30px;
		}		
	}
	

		@media screen and (min-width:240px) and (max-width:399px){
			#hp-img-01{height: 195px;}
			.stage{width: auto; margin: 0 auto;  padding:0 20px 20px 20px;}
			.stage h3{ font-size:22px !important; padding:20px 0 !important;}
			.stage h3 span.bg{
				background: none;
				padding: 0 !important;
			}
			.stage h3 span.txt{
			    background: none repeat scroll 0 0 #FFF;
			    padding: 0 !important;
			}
			#hp-column-01 .graphic{
			width: 100%;
			text-align: center;
			}
			#hp-column-01 .description{
			width: 100%;
			margin-top: 30px;
			}
			#hp-column-04 .graphic{
			width: 100%;
			text-align: center;
			}
			#hp-column-04 .description{
			width: 100%;
			margin-top: 30px;
			}
			#hp-column-01, #hp-column-02, #hp-column-03, #hp-column-04 {
			padding-bottom: 20px;
			}
			#hp-column-02 .step-01,#hp-column-02 .step-02,#hp-column-02 .step-04,#hp-column-02 .step-05{
			width: 100%;
			}			
			#hp-column-02 .step-03,#hp-column-02 .step-06{
			width: 100%;
			}			
			#hp-column-03 .advantage-01,#hp-column-03 .advantage-02,#hp-column-03 .advantage-04,#hp-column-03 .advantage-05,#hp-column-03 .advantage-07,#hp-column-03 .advantage-08{
			width: 100%;
			}
			#hp-column-03 .advantage-03,#hp-column-03 .advantage-06,#hp-column-03 .advantage-09{
			width: 100%;
			}			
		}

.estimation-01{
	float: left;
	width: 48%;
}
.estimation-01 table{
	width: 100%;
	border: none !important;
}
.estimation-01 table tr{
	border: none !important;
	text-align: left;
}
.estimation-01 table tr th{
	padding: 15px 0;
	background-color: #FFF;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
}
.estimation-01 table tr td{
	padding: 15px 0;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
	border-bottom: 1px solid #d8d8d8;
}
.estimation-01 table tr td.total{
	border-bottom: 3px solid #00b4e7;
}

.estimation-02{
	float: right;
	width: 48%;
}
.estimation-02 table{
	width: 100%;
	border: none !important;
}
.estimation-02 table tr{
	border: none !important;
	text-align: left;
}
.estimation-02 table tr th{
	padding: 15px 0;
	background-color: #FFF;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
}
.estimation-02 table tr td{
	padding: 15px 0;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
	border-bottom: 1px solid #d8d8d8;
}
.estimation-02 table tr td.total{
	border-bottom: 3px solid #3dcb00;
}


	@media screen and (min-width:420px) and (max-width:860px){
		.estimation-01{
			width: 100%;
		}
		.estimation-02{
			width: 100%;
			margin-top: 50px;
		}
	}


/* =========================== SmartPhone =========================== */

#sp-img-01{
	height: 415px;
	background: url(images/new/mob-main.jpg) no-repeat center top;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-filter: brightness(70%);
}
#sp-column-01,#sp-column-02,#sp-column-03{
	background-color: #FFF;
}
#sp-column-01 h4{
	font-size: 18px;
}
#sp-column-01 .description{
	float: left;
	width: 52%;
}
#sp-column-01 .graphic{
	float: right;
	width: 45%;
	padding-left: 3%;
}


#sp-column-02 h4 {
	font-size: 18px;
}
#sp-column-02 ul { padding: 0 !important; }
#sp-column-02 ul li{
	list-style: none;
}
#sp-column-02 .iphone{
	margin-top: 50px;
}

#sp-column-02 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#sp-column-02 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}
#sp-column-02 h4{font-size: 18px; margin: 0 !important;}
.iphone-01 h4{background: url(images/h4-icon-15.png) no-repeat 0 0; padding: 20px 0 30px 70px;}
.iphone-02 h4{background: url(images/h4-icon-16.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-03 h4{background: url(images/h4-icon-03.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-04 h4{background: url(images/h4-icon-17.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-05 h4{background: url(images/h4-icon-08.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}


#sp-column-03 h4{font-size: 18px; margin: 0 !important;}
#sp-column-03 ul { padding: 0 !important; }
#sp-column-03 ul li{
	list-style: none;
}
#sp-column-03 .stage{
	border: none;
}
#sp-column-03 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#sp-column-03 .iphone{
	margin-top: 50px;
}
#sp-column-03 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#sp-column-03 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}

	@media screen and (min-width:860px){
		.inner h3 {
			font-size: 30px;
			margin-top: 20px;
			margin-bottom: 10px;
		}
		
		#sp-column-01 {
			width: 1000px;
			margin: 0 auto;
		}
		#sp-column-02 {
			width: 1000px;
			margin: 0 auto;
		}
		#sp-column-03 {
			width: 1000px;
			margin: 0 auto;
		}
	}

	@media screen and (min-width:400px) and (max-width:959px){
		#sp-img-01{height: 355px;}
		#sp-column-01 h4{
			font-size: 18px;
		}
		#sp-column-01 .description{
			width: 100%;
			margin-top: 30px;
		}
		#sp-column-01 .graphic{
			text-align: center;
			width: 100%;
		}

	}
		
		@media screen and (min-width:240px) and (max-width:399px){
			#sp-img-01{height: 195px;}
			#sp-column-01 h4{
			font-size: 18px;
			}
			#sp-column-01 .description{
				width: 100%;
				margin-top: 30px;
			}
			#sp-column-01 .graphic{
				text-align: center;
				width: 100%;
			}
			#sp-column-02 .iphone{
				margin-top: 50px;
			}

			#sp-column-02 .iphone-01,#sp-column-02 .iphone-02,#sp-column-02 .iphone-04{
				width: 100%;
			}
			#sp-column-02 .iphone-03,#sp-column-02 .iphone-05{
				width: 100%;
			}
			#sp-column-03 .iphone{
				margin-top: 50px;
			}
			#sp-column-03 .iphone-01,#sp-column-03 .iphone-02,#sp-column-03 .iphone-04{
				width: 100%;
			}
			#sp-column-03 .iphone-03,#sp-column-03 .iphone-05{
				width: 100%;
			}
		}

/* =========20171030 security =========================== */

.mt40 {
margin-top: 4%;
}
.mb40 {
margin-bottom: 4%;
}
.mb80 {
margin-bottom: 8%;
}

#scr-img-01{
	height: 415px;
	background: url(images/hp_cloud.jpg) no-repeat center top;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-filter: brightness(40%);
}

#scr-column-01 h4{
	font-size: 18px;
}
#scr-column-01 .description{
	width: 100%;
}
#scr-column-01 .graphic{
	float: right;
	width: 45%;
	padding-left: 3%;
}

#scr-column-02 h4 {
	font-size: 18px;
}
#scr-column-02 ul { padding: 0 !important; }
#scr-column-02 ul li{
	list-style: none;
}
#scr-column-02 .iphone{
	margin-top: 50px;
}

#scr-column-02 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#scr-column-02 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}
#scr-column-02 h4{font-size: 18px; margin: 0 !important;}
.iphone-01 h4{background: url(images/h4-icon-15.png) no-repeat 0 0; padding: 20px 0 30px 70px;}
.iphone-02 h4{background: url(images/h4-icon-16.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-03 h4{background: url(images/h4-icon-03.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-04 h4{background: url(images/h4-icon-17.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-05 h4{background: url(images/h4-icon-08.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}


#scr-column-03 h4{font-size: 18px; margin: 0 !important;}
#scr-column-03 ul { padding: 0 !important; }
#scr-column-03 ul li{
	list-style: none;
}
#scr-column-03 .stage{
	border: none;
}
#scr-column-03 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#scr-column-03 .iphone{
	margin-top: 50px;
}
#scr-column-03 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#scr-column-03 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}


	@media screen and (min-width:860px){
		.inner h3 {
			font-size: 30px;
			margin-top: 20px;
			margin-bottom: 10px;
		}
		
		#scr-column-01 {
			width: 1000px;
			margin: 0 auto;
		}
		#scr-column-02 {
			width: 1000px;
			margin: 0 auto;
		}
		#scr-column-03 {
			width: 1000px;
			margin: 0 auto;
		}
	}

	@media screen and (min-width:400px) and (max-width:959px){
		#scr-img-01{height: 355px;}
		#scr-column-01 h4{
			font-size: 18px;
		}
		#scr-column-01 .description{
			width: 100%;
			margin-top: 30px;
		}
		#scr-column-01 .graphic{
			text-align: center;
			width: 100%;
		}

	}
		
		@media screen and (min-width:240px) and (max-width:399px){
			#scr-img-01{height: 195px;}
			#scr-column-01 h4{
			font-size: 18px;
			}
			#scr-column-01 .description{
				width: 100%;
				margin-top: 30px;
			}
			#scr-column-01 .graphic{
				text-align: center;
				width: 100%;
			}
			#scr-column-02 .iphone{
				margin-top: 50px;
			}

			#scr-column-02 .iphone-01,#scr-column-02 .iphone-02,#scr-column-02 .iphone-04{
				width: 100%;
			}
			#scr-column-02 .iphone-03,#scr-column-02 .iphone-05{
				width: 100%;
			}
			#scr-column-03 .iphone{
				margin-top: 50px;
			}
			#scr-column-03 .iphone-01,#scr-column-03 .iphone-02,#scr-column-03 .iphone-04{
				width: 100%;
			}
			#scr-column-03 .iphone-03,#scr-column-03 .iphone-05{
				width: 100%;
			}
		}

/* =========20171031 cloud =========================== */

#cld-img-01{
	height: 415px;
	background: url(images/hp_cloud.jpg) no-repeat center top;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-filter: brightness(40%);
}
#cld-img-02{
	height: 415px;
	background: url(images/hp_company.jpg) no-repeat center top;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-filter: brightness(40%);
}

#cld_lft {
width: 45%;
height: auto;
box-sizing: border-box;
float: left;
}
#cld_lft_inr {
width: 100%;
height: auto;
border: 3px #9f9f9f solid;
box-sizing: border-box;
margin-bottom: 2%;
}
.bk_9f {
width: 100%;
height: auto;
box-sizing: border-box;
background-color: #9f9f9f;
font-size: calc(112.5% + 0.25vw);
color: #fff;
text-align: center !important;
font-weight: bold;
padding: 2% 0;
margin: 0;
}
.cld_img01 {
width: 90%;
height: auto;
margin: 5%;
text-align: center;
}

#cld_cnt {
width: 10%;
height: auto;
box-sizing: border-box;
float: left;
padding: 13% 0;
text-align: center;
}
#cld_cnt img {
margin:auto;
}

#cld_rht {
width: 45%;
height: auto;
box-sizing: border-box;
float: left;
}
#cld_rht_inr {
width: 100%;
height: auto;
border: 3px #9f9f9f solid;
box-sizing: border-box;
margin-bottom: 2%;
}

.cld_center {

}
/* 幅が 480px 以下であれば */
@media (max-width:768px) {

/* 会社案内 */
	div.inner_company div.contents{
		padding-top: 0;
	}
	div.container{
		margin: 0 auto;
		background: #fff;
	    font-size: 3.6vw;
	    line-height: 1.8;
	    letter-spacing: 0.2vw;
	    padding-bottom: 12vw;
	}
	div.inner_company{
		padding-top: 0;
	}
	div.inner_company div.contents {
		margin-left: 5vw;
		margin-bottom: 20vw;
	}
	div.container dl{	
		border-bottom: 1px dotted #dadada;
		background: #f0f0f0;
    	overflow: hidden;

		margin: 0 auto;
	    font-size: 3.6vw;
	    line-height: 1.8;
	    letter-spacing: 0.2vw;
	}
	dl.top{
		border-top: 1px dotted #dadada;
	}
	div.container dt{
		width: 24vw;
    	float: left;
    	padding: 5vw 0 0;

		margin: 0 auto;
	    font-size: 3.6vw;
	    line-height: 1.8;
	    letter-spacing: 0.2vw;
	    text-align: center;	
	}
	div.container dd{
    	width: 55vw;
    	float: left;
    	text-align: left;
   		padding: 5vw 0 5vw 5vw;
   		background: #fff;
	}
	div.container dd p.btn{
		display: inline-block;
		vertical-align: top;
		margin: 4vw 0 0 0;
		position: relative;
	}
	div.container dd p.btn a{
		width: 55vw;
		font-size: 3.6vw;
		line-height: 1.4;
	}
	div.container dd p.btn a span{
		top: 5vw;
		font-size: 5vw;
	}
	div.container dd p.btn a{
		width: 42vw;
    	text-align: left;
    	padding-left: 9vw;
	}
	div.container dd p.btn span{
		content: '';
		display: block;
		background-size: contain;
		width: 4vw;
    	height: 4vw;
    	position: absolute;
    	top: 6vw;
    	right: 6vw;
    	transform: none;
	}
	div.accessmap div.txt p.googlemap span{
		content: '';
		display: block;
		background: url(../img/index/ico_link.png) no-repeat;
		background-size: contain;
		width: 4vw;
    	height: 4vw;
    	position: absolute;
    	top: 4vw;
    	right: 17vw;
    	transform: none;
	}

	/* ----- access ----- */
	div.map{
		background: #fff;
	}
	div.contents h3{
		float: left;
		padding: 0;
	}
	div.accessmap div.map{
		clear: both;
		float: left;
		width: 100%;
		height: 100vw;
		margin: 0 auto 5vw;
	}
	div.accessmap div.txt{
		clear: both;
    	text-align: left;
    	font-size: 4vw;
	}
	div.accessmap div.txt p.googlemap{
		width: 85vw;
		margin: 35px auto 0;
		font-size: 5.5vw;
		position: relative;
	}
p.btn a {
    display: inline-block;
    vertical-align: top;
    width: 87vw;
    font-size: 4.6vw;
    color: #000000;
    text-align: center;
    letter-spacing: 0.2vw;
    line-height: 1;
    /* background-color: #ffffff; */
    border: 1px solid #000000;
    padding: 3.5vw 0;
    position: relative;
}

/* スマホ時のタイトル調整 */
.keytitle .ttl {
  padding-top: 50px;
  }

#cld_lft {
width: 90%;
height: auto;
margin: 0 5%;
box-sizing: border-box;
float: none;
}

#cld_cnt {
width: 90%;
height: auto;
margin: 0 5%;
box-sizing: border-box;
float: none;
padding: 0% 40%;
}
#cld_cnt img {
margin:auto;
transform: rotate(90deg);
-ms-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
}
#cld_rht {
width: 90%;
height: auto;
margin: 0 5%;
box-sizing: border-box;
float: none;
}
}


#cld-column-01 h4{
	font-size: 18px;
}
#cld-column-01 .description{
	width: 100%;
}
#cld-column-01 .graphic{
	float: right;
	width: 45%;
	padding-left: 3%;
}

#cld-column-02 h4 {
	font-size: 18px;
	text-align: center !important;
}

#cld-column-02 ul { padding: 0 !important; }
#cld-column-02 ul li{
	list-style: none;
}
#cld-column-02 .iphone{
	margin-top: 50px;
}

#cld-column-02 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#cld-column-02 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}
#cld-column-02 h4{font-size: 18px; margin: 0 !important;}
.iphone-01 h4{background: url(images/h4-icon-15.png) no-repeat 0 0; padding: 20px 0 30px 70px;}
.iphone-02 h4{background: url(images/h4-icon-16.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-03 h4{background: url(images/h4-icon-03.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-04 h4{background: url(images/h4-icon-17.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}
.iphone-05 h4{background: url(images/h4-icon-08.png) no-repeat 0 5px; padding: 20px 0 30px 70px;}


#cld-column-03 h4{font-size: 18px; margin: 0 !important;}
#cld-column-03 ul { padding: 0 !important; }
#cld-column-03 ul li{
	list-style: none;
}
#cld-column-03 .stage{
	border: none;
}
#cld-column-03 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#cld-column-03 .iphone{
	margin-top: 50px;
}
#cld-column-03 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#cld-column-03 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}


	@media screen and (min-width:769px){
		.inner h3 {
			font-size: 30px;
			margin-top: 20px;
			margin-bottom: 10px;
		}
		
		#cld-column-01 {
			width: 1000px;
			margin: 0 auto;
		}
		#cld-column-02 {
			width: 1000px;
			margin: 0 auto;
		}
		#cld-column-03 {
			width: 1000px;
			margin: 0 auto;
		}
	}

	@media screen and (min-width:400px) and (max-width:959px){
		#cld-img-01{height: 355px;}
		#cld-column-01 h4{
			font-size: 18px;
		}
		#cld-column-01 .description{
			width: 100%;
			margin-top: 30px;
		}
		#cld-column-01 .graphic{
			text-align: center;
			width: 100%;
		}

	}
		
		@media screen and (min-width:240px) and (max-width:399px){
			#cld-img-01{height: 195px;}
			#cld-column-01 h4{
			font-size: 18px;
			}
			#cld-column-01 .description{
				width: 100%;
				margin-top: 30px;
			}
			#cld-column-01 .graphic{
				text-align: center;
				width: 100%;
			}
			#cld-column-02 .iphone{
				margin-top: 50px;
			}

			#cld-column-02 .iphone-01,#cld-column-02 .iphone-02,#cld-column-02 .iphone-04{
				width: 100%;
			}
			#cld-column-02 .iphone-03,#cld-column-02 .iphone-05{
				width: 100%;
			}
			#cld-column-03 .iphone{
				margin-top: 50px;
			}
			#cld-column-03 .iphone-01,#cld-column-03 .iphone-02,#cld-column-03 .iphone-04{
				width: 100%;
			}
			#cld-column-03 .iphone-03,#cld-column-03 .iphone-05{
				width: 100%;
			}
		}




/* =========================== Offshore =========================== */

#os-img-01{
	height: 415px;
	background: url(images/wp-main.jpg) no-repeat center top;
	-moz-background-size: cover;
	background-size: cover;
	-webkit-filter: brightness(40%);
}
#os-column-01,#os-column-02,#os-column-03{
	background-color: #FFF;
}
#os-column-01 h4{
	font-size: 18px;
}

#os-column-01 .description{
	float: left;
	width: 52%;
}
#os-column-01 .graphic{
	float: right;
	width: 45%;
	padding-left: 3%;
}

#os-column-02 h4 {
	font-size: 18px;
	font-weight: bold;
}
#os-column-02 h4 span{
	font-size: 14px;
	display: block;
}
#os-column-02 ul { padding: 0 !important; }
#os-column-02 ul li{
	list-style: none;
	color: #7d8186;
}
#os-column-02 .step-01,.step-02,.step-04,.step-05{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#os-column-02 .step-03,.step-06{
	width: 32%;
	float: left;
}

#os-column-02 h4{font-size: 18px; margin: 0 !important;}
#os-column-02 .step-01 h4{background: url(images/h4-icon-07.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}
#os-column-02 .step-02 h4{background: url(images/h4-icon-11.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}
#os-column-02 .step-03 h4{background: url(images/h4-icon-17.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}
#os-column-02 .step-04 h4{background: url(images/h4-icon-18.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}
#os-column-02 .step-05 h4{background: url(images/h4-icon-19.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}
#os-column-02 .step-06 h4{background: url(images/h4-icon-20.png) no-repeat 0 5px; padding: 10px 0 20px 70px;}


#os-column-03 h4 {
	font-size: 18px;
	font-weight: bold;
}
#os-column-03 h4 span{
	font-size: 14px;
	display: block;
}
#os-column-03 ul { padding: 0 !important; }
#os-column-03 ul li{
	list-style: none;
	color: #7d8186;
}
#os-column-03 .advantage-01,.advantage-02,.advantage-04,.advantage-05{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#os-column-03 .advantage-03,.advantage-06{
	width: 32%;
	float: left;
}
#os-column-03 h4{font-size: 18px; margin: 0 !important;}
#os-column-03 .advantage-01 h4{background: url(images/h4-icon-15.png) no-repeat 0 0px; padding: 15px 0 30px 70px;}
#os-column-03 .advantage-02 h4{background: url(images/h4-icon-04.png) no-repeat 0 0px; padding: 15px 0 30px 70px;}
#os-column-03 .advantage-03 h4{background: url(images/h4-icon-08.png) no-repeat 0 0px; padding: 3px 0 15px 70px;}
#os-column-03 .advantage-04 h4{background: url(images/h4-icon-03.png) no-repeat 0 0px; padding: 15px 0 30px 70px;}
#os-column-03 .advantage-05 h4{background: url(images/h4-icon-11.png) no-repeat 0 0px; padding: 3px 0 15px 70px;}
#os-column-03 .advantage-06 h4{background: url(images/h4-icon-13.png) no-repeat 0 0px; padding: 15px 0 30px 70px;}

#os-column-03 .arrows{
	width: 100%;
	height: 27px;
	background: url(images/hp-arrows-01.png) no-repeat center;
}
#os-column-03 .iphone{
	margin-top: 50px;
}
#os-column-03 .iphone-01,.iphone-02,.iphone-04{
	width: 32%;
	padding-right: 2%;
	float: left;
}
#os-column-03 .iphone-03,.iphone-05{
	width: 32%;
	float: left;
}
#os-column-04 .stage{
	border: none;
}

	@media screen and (min-width:860px){
		.inner h3 {
			font-size: 30px;
			margin-top: 20px;
			margin-bottom: 10px;
		}
		
		#os-column-01 {
			width: 1000px;
			margin: 0 auto;
		}
		#os-column-02 {
			width: 1000px;
			margin: 0 auto;
		}
		#os-column-03 {
			width: 1000px;
			margin: 0 auto;
		}
		#os-column-04 {
			width: 1000px;
			margin: 0 auto;
		}
	}


	@media screen and (min-width:400px) and (max-width:959px){
		#os-img-01{height: 355px;}
		#os-column-01 h4{
			font-size: 18px;
		}
		#os-column-01 .description{
			width: 100%;
			margin-top: 30px;
		}
		#os-column-01 .graphic{
			text-align: center;
			width: 100%;
		}

	}
		
		@media screen and (min-width:240px) and (max-width:399px){
			#os-img-01{height: 195px;}
			#os-column-01 .description{
				width: 100%;
				margin-top: 30px;
			}
			#os-column-01 .graphic{
				width: 100%;
			}
			#os-column-02 .step-01,.step-02,.step-04,.step-05{
				width: 100%;
			}
			#os-column-02 .step-03,.step-06{
				width: 100%;
			}
			#os-column-03 .advantage-01,.advantage-02,.advantage-04,.advantage-05{
				width: 100%;
			}
			#os-column-03 .advantage-03,.advantage-06{
				width: 100%;
			}
		}


/* =========================== Contact =========================== */
#contact-column-01{
	max-width: 700px;
	margin: 0 auto;
	padding:0 10px;
	padding-top: 70px;
	position: relative;
}
#contact-column-01 .stage{
	border: none;
}
#contact-column-01 h4{
	margin-bottom: 16px;
	font-size: 20px;
}
#contact-column-01 .number{
	margin-bottom: 0px;
	padding: 16px 0 16px 60px;
	background: url(images/contact-icon.png) no-repeat 0px;
	background-size: 50px 50px;
	font-family: Arial, Helvetica, 'Hiragino Kaku Gothic Pro W3', 'Hiragino Kaku Gothic Pro', sans-serif;
	font-size: 40px;
	font-weight: bold;
}
#contact-column-01 .number a{
	text-decoration: none;
	color: #333333;
}
#contact-column-01 .info{
	margin-bottom: 0;
	padding-top: 0;
	font-size: 16px;
	text-align: center;
}
#contact-column-01 .info span{
	display:inline-block;
	font-size:.9em;
}
#contact-column-01 .info span:not(:last-child){margin-right:.5em;}
#contact-column-01 .contact-column-tel {
	display:flex;
	flex-direction: column;
	align-items: center;
	margin-bottom:40px;
	padding:0 16px;
	border: 1px solid #C1CEC0;
    border-radius: 5px;
}
#contact-column-01 .contact-column-form {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom:70px;
	padding:16px;
	padding-top:36px;
	border: 1px solid #C1CEC0;
    border-radius: 5px;
}
#contact-column-01 .contact-column-form-inner {
	width: 100%;
	max-width: 500px;
}

#contact-column-01 .attention{
	color: #FF0000;
}
#contact-column-01 .contact-tbl{
	width: 100%;
	margin-top: 20px;
	display: block;
	max-width: 1000px;
}
#contact-column-01 table{
	border: none !important;
}
#contact-column-01 table tr{
	border: none !important; 
}
#contact-column-01 table tr th{
	width: 20%;
	border-bottom: 1px solid #d8d8d8;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
	vertical-align: middle;
	text-align: left;
	font-weight: bold;
	background: none !important;
}
#contact-column-01 table tr td{
	padding: 20px 0;
	border-bottom: 1px solid #d8d8d8;
	border-top: none !important;
	border-right: none !important;
	border-left: none !important;
}
#contact-column-01 .contact-submit{
	width:49%;
	float: left;	
}
#contact-column-01 .contact-reset{
	width:49%;
	float: right;	
}
#contact-column-01 input[type=text]{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 8px 15px;
    border: 1px solid #AFBFC7;
    border-radius: 3px;
    background-color: #FFFFFF;
    box-shadow: none;
}
#contact-column-01 textarea{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 8px 15px;
    border: 1px solid #AFBFC7;
    border-radius: 3px;
    background-color: #FFFFFF;
    box-shadow: none;
}
#contact-column-01 input .input-name{
display:inline-flex;
}
#contact-column-01 input[type=submit]{
    width:90%;
    font-size:24px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:8px 0 10px;
    color:#fff;
    background-color:#58b530;
}
#contact-column-01 input[type=reset]{
    width:90%;
    font-size:24px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:8px 0 10px;
    color:#fff;
	background-color: #555555;
    box-shadow:2px 2px #555;
}
#contact-column-01 input[type=radio]{
	display: none;
}
#contact-column-01 label{
	display: block;
	float: left;
	cursor: pointer;
	height: 60px;
	margin: 0;
	padding: 12px 5px;
	border-right: 1px solid #abb2b7;
	background: #bdc3c7;
	color: #555e64;
	font-size: 14px;
	text-align: center;
	line-height: 1;
	transition: .2s;
	
}
#contact-column-01 label:first-of-type{
	border-radius: 3px 0 0 3px;
}
#contact-column-01 label:last-of-type{
	border-right: 0px;
	border-radius: 0 3px 3px 0;
}
#contact-column-01 input[type="radio"]:checked + label {
	background-color: #58b530;
	color: #fff;
}
#contact-column-01 .mod-icon-inquiry{
margin-left: 15px;
padding: 2px 6px;
background-color: #58b530;
color: #fff;
font-size: 72%
}
#contact-column-01 dl{
/*display: table;*/
width: 100%;
margin-bottom: 15px;
margin-top: 15px;
border-bottom: 1px dotted #eee
}
#contact-column-01 dt{
/*display: table-cell;*/
display: block;
font-weight: normal;
vertical-align: middle;
float: left;
padding-bottom: 5px;
font-weight: bold;
}
#contact-column-01 dd{
/*display: table-cell;*/
width: auto;
/*margin-left: 245px;*/
padding-bottom: 10px;
/*float: left;*/
}
#contact-column-01 .clearBoth{
clear: both;
}

.button {
	display: inline-block;
	width: 200px;
	height: 54px;
	text-align: center;
	text-decoration: none;
	line-height: 54px;
	outline: none;
}
.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.button {
	background-color: #333;
	color: #fff;
}
.button:hover {
	background-color: #666;
}

	@media screen and (min-width:959px){
		#contact-column-01{
		width: 900px;
		}
		#contact-column-01 dl{
		/*display: table;*/
		display; block;
		}
		#contact-column-01 d{
		/*display: table-cell;*/
		display: block;
		}
		#contact-column-01 dd{
		width: 100%;
		margin-left: 245px;
		/*display: table-cell;*/
		}
		#contact-column-01 label{
			width: 80px;
		}
		#contact-column-01 textarea{
			width: 60%;
		}
		#contact-column-01 input.long{
			width: 60%;
		}
		#contact-column-01 input.short{
			width: 25%;
		}

	}

	@media screen and (min-width:240px) and (max-width:959px){
		/* #contact-column-01 .number{ width: 100%; margin-bottom: 0px;}
		#contact-column-01 .info{ width: 100%; margin-bottom: 20px;} */
		#contact-column-01 label{
			width: 100%;
			margin-left: 0;
			height: 20px;
		}

	}
	@media screen and (min-width:240px) and (max-width:399px){
			#contact-column-01 dl{
			margin-bottom: 25px;
			border-bottom: 1px dotted #eee
			}
			#contact-column-01 dt{
			padding-bottom: 25px;
			font-weight: bold;
			}
			#contact-column-01 dd{
			padding-bottom: 25px;
			}

	}
	@media screen and (min-width:240px) and (max-width:440px){
		#contact-column-01 .number{font-size: 26px;}
	}
	@media screen and (max-width:350px){
		#contact-column-01 .number{font-size: 20px;}
	}


@media screen and (min-width:240px) and (max-width:399px) {
	.main-gallery {
		padding:0 0 30px;
	}
}
.gallery-holder {
	max-width: 946px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
}
.gallery {
	max-width: 870px;
	margin: 0 auto 50px;
	position: relative;
	overflow: hidden;
}
.bxslider-product img {vertical-align: top;}
.bxslider-product li {border:1px solid #ddd;}
.bx-controls .bx-prev,
.bx-controls .bx-next {
	width: 45px;
	height: 45px;
	margin: -22px 0 0;
	position: absolute;
	top: 50%;
	overflow: hidden;
	text-indent: -9999px;
}
.bx-controls .bx-prev {
	background: url(images/btn-prev.png) no-repeat;
	left: 10px;	
}
.bx-controls .bx-next {
	background: url(images/btn-next.png) no-repeat;
	right: 10px;
}
@media screen and (min-width:240px) and (max-width:399px) {
	.bx-controls .bx-prev, .bx-controls .bx-next{
		width:20px;
		height:20px;
		margin:0;
	}
}
@media screen and (min-width:240px) and (max-width:399px) {
	.bx-controls .bx-prev {background: url(images/btn-prev-s.png) no-repeat;}
	.bx-controls .bx-next {background: url(images/btn-next-s.png) no-repeat;}
}
.main-gallery .bx-wrapper {
	padding: 59px 68px 29px;
	position: relative;
}
@media screen and (min-width:240px) and (max-width:399px) {
	.main-gallery .bx-wrapper {
	padding: 40px 35px 0px;
	}
}
.gallery-frame {padding: 0 85px;}
@media screen and (min-width:400px) and (max-width:959px) {
	.gallery-frame {padding: 0 56px;}
}
@media screen and (min-width:240px) and (max-width:399px) {
	.gallery-frame {padding: 0 30px;}
}
#bx-pager {
	overflow: hidden;
	text-align: center;
}
#bx-pager a {
	display: inline-block;
	padding: 0px;
	background: #fff;
	outline: none;
	border: 1px solid #888888;
	/*border-radius: 5px;*/
	margin:5px;
}
#bx-pager .active {border-color: #00B4E7;} 
*+ html #bx-pager a {display: inline;}
#bx-pager img {
	height: 90px;
	max-width: 100%;
	display: block;
}
#main {
	width: 100%;
	position: relative;
}
.main-holder {
	width: 100%;
	background: #f8f8f8;
}
.main-content {
	max-width: 1002px;
	margin: 0 auto;
	padding: 60px 10px;
}
.main-contact {padding: 48px 10px;}
.info-list {
	overflow: hidden;
	margin: 0 0 0 -2.833%;
}
.info {
	line-height: 20px;
}
.info h2 {
	font-size: 18px;
	line-height: 20px;
	font-weight: bold;
}
@media screen and (min-width:240px) and (max-width:399px) {
	.info h2 {
		font-size: 16px;
		line-height: 1.5;
		font-weight: bold;
	}
}
.info-list li {
	float: left;
	padding: 0 0 0 2.833%;
	width: 30.5%;	
}
@media screen and (min-width:240px) and (max-width:640px) {
	.info-list {
		overflow: hidden;
		margin: 0;
	}
	.info-list li {
		float: none;
		width: 100%;
		padding: 0 0 30px;
		text-align: center;
	}
}
.info-list h2 {
	height: 100px;
	display: table-cell;
	vertical-align: middle;
	padding: 0 0 0 122px;
	color: #333;
}
.info-list .design h2 {background: url(images/ico-design.png) no-repeat;}
.info-list .tablet h2 {background: url(images/ico-tablet.png) no-repeat;}
.info-list .cms h2 {background: url(images/ico-cms.png) no-repeat;}
.info .btn {width: auto;}
.info .description {padding: 23px 0 0;}
.info p {margin: 0 0 18px;}
.contact-block {
	max-width: 842px;
	margin: 0 auto;
	overflow: hidden;
	color: #000;
	line-height: 19px;
}
.contact-block h2 {
	float: left;
	font-size: 35px;
	line-height: 37px;
	color: #000;
	font-weight: normal;
	margin: 5px 55px 0 0;
}
.contact-block .contact-description {
	float: left;
	padding: 5px 0 0;
}
.contact-block .btn {
	float: right;
	width: 252px;
}
.decor-block {
	width: 100%;
}
.decor-block img {vertical-align: top;}
.decor-holder {
	width: 100%;
	text-align: center;
	position: relative;
	height: 640px;
	background: url(images/img-01.jpg) no-repeat 50% 50% fixed;
	/*background: url(http://tec.efusion.co.jp/wp/os-content/uploads/2014/03/sample.jpg) no-repeat 50% 50% fixed;*/
	background-size: cover;
}
.heading {
	overflow: hidden;
	margin: 0 0 50px;
}
.heading h2 {
	float: left;
	color: #333;
	font-size: 30px;
	line-height: 36px;
	margin: 0 38px 0 0;
}
@media screen and (min-width:240px) and (max-width:768px) {
	.heading h2{
		font-size:24px;
		margin: 0 0px 0 0;
	}
	.heading-content p{
		font-size:14px;
	}
}
.heading .title {
	float: left;
	display: inline-block;
	font-size: 16px;
	line-height: 18px;
	margin: 9px 0 0;
	padding: 0 62px 0 0;
	background: url(images/bg-line.gif) no-repeat 100% 50%;
}
.col-holder {
	overflow: hidden;
}
.col-holder dl {
	float: left;
	font-size: 14px;
	line-height: 18px;
	color: #333;
	width: 380px;
	padding: 0 50px 0 0;
}
@media screen and (min-width:240px) and (max-width:320px) {
	.col-holder dl {
		width:280px;
	}
}
.col-holder dl dt {
	float: left;
	width: 120px;
	padding: 0 10px 0 0;
	font-weight: bold;
}
.col-holder dl dd {
	padding: 0 0 22px;
	line-height: 24px;
	overflow: hidden;
}
.map {
	width: 100%;
	overflow: hidden;
	position: relative;
}
#map_canvas{
	width: 100%;
	height: 500px;
}
.map .label {
	width: 110px;
	height: 133px;
	background: url(images/ico-label.png) no-repeat;
	position: absolute;
	top: 123px;
	left: 50%;
	text-indent: -9999px;
	overflow: hidden;
	margin: 0 0 0 -52px;
}
.main-heading {
	width: 100%;
	border-bottom: 1px solid #d6d9d4;
	font-size: 16px;
	line-height: 18px;
	color: #000;
}
.page-details .main-heading .heading {margin: 0;}
.page-details .main-heading .heading-content {padding: 51px 10px;}
.main-heading .heading {margin: 0 0 19px;}
.heading-content {
	max-width: 1002px;
	margin: 0 auto;
	padding: 58px 10px 57px 10px;
}
.main-heading .btn {
	width: 306px;
	float: right;
}
.item-list ul {margin: 0 0 45px -3.633%;}
*+ html .item-list {overflow: hidden;}
.item-list ul:after {
	content:'';
	display:block;
	clear:both;
}
.item-list ul li {
	width: 29.7%;
	float: left;
	padding: 0 0 0 3.633%;
}
.item {width: 100%;}
.item .image {margin: 0 0 20px;}
.item .image img {border:1px solid #e0e0e0;}
.item h3 {
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 17px;
	color: #000;
}
.item p {margin:0; line-height:1.5;}
.item .description p {padding-bottom:15px;}


.item .btn {
	width: auto;
}
.item .image a img{
	-webkit-transition: 0.3s ease-in-out;  
	-moz-transition: 0.3s ease-in-out;  
	-o-transition: 0.3s ease-in-out;  
	transition: 0.3s ease-in-out;  
}
.item .image a img:hover{
	opacity:0.7;
}
.container {
	width: 100%;
	background: #f3f2ea;
	border-bottom:1px solid #d6d9d4;
}
.error404 .container {
	background: linear-gradient(45deg, #fbfffa 0%, #f6fdf4 100%);
}
.container-hp {
	width: 100%;
	background: #FFF;
	border-bottom:1px solid #d6d9d4;
}

.container-add {background: url(images/bg-container.gif);}
.title-page {margin: 0 0 26px;}
.title-page h2 {
	font-size: 24px;
	line-height: 26px;
	margin: 0 0 14px;
}
.title-page .link {
	display: block;
	font-size: 15px;
	line-height: 17px;
}
.image-detail {
	text-align: center;
}
ul.boxs-list{display:none !important;}
.box-info{display:none !important;}
/*.boxs-list li {margin: 30px 0 0;}
.boxs-list li:first-child {margin: 0;}
.box-info {
	border:1px solid #d6d9d4;
	padding:24px 38px;
}
.box-info h3 {
	font-size: 18px;
	line-height: 24px;
	margin: 0 0 15px;
}
.box-info p {
	line-height: 1.5;
}*/
#footer {
	width: 100%;
	background: #000;
	color: #fff;
}
.footer-holder {
	max-width: 1002px;
	margin: 0 auto;
	padding: 50px 10px;	
}
#footer .logo {
	margin: 0 0 0 auto;
	padding: 0 0 18px;
	float: none;
	display: block;
}
#footer .copyright {
	text-align: right;
	display: block;
	font-size: 14px;
}
.textwidget p{ padding: 0 0 10px; }

/* Respond */
#respond{
	margin:20px 0 20px 0;
	overflow:hidden;
}
.commentlist #respond{
	margin:0 0 20px 0;
}
#respond .comment-reply-title{
	margin: 0 0 5px 0;
}
#respond .comment-reply-title small{
	font-size: 12px;
	font-weight: normal;
}
#commentform p{
	width:100%;
	overflow:hidden;
	padding: 0 0 10px;
	margin: 0;
}
#commentform p label{
	display: block;
	padding: 0 0 5px;
}
#commentform p textarea{
	width: 98%;
}

/* Typography */

.entry{
	width:100%;
	line-height:1.4em;
	padding: 0 0 37px;
}
.entry a{
	text-decoration:underline !important;
}
.entry a:hover{
	text-decoration:none !important;
}
.content, .title-page h2{
  font-family: Quicksand, "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 30px !important;
}
.main-news div.entry,
.error404 div.entry {
	margin:0 0 20px 0;
	line-height:1.7;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
}
.entry h1{font-size: 28px;}  .entry h2{font-size: 22px;}  .entry h3{font-size: 18px;}  .entry h4{}  .entry h5{}  .entry h6{}
.entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6{
	line-height:1.5em;
	margin: 30px 0 20px;
	color: #000;
	font-weight: bold;
}
.entry ul{ margin: 0 0 20px 0; padding: 0 0 0 30px; }
.entry ul ul, .entry ul ol{ margin: 0; }
.entry ul li{	list-style-type: disc;  line-height: 1.5em;}
.entry ul ul li{ list-style-type: circle; }
.entry  ul li ol li{ list-style-type: decimal; }

.entry ol{ margin: 0 0 20px 0; padding: 0 0 0 30px; }
.entry ol ol, .entry ol ul{ margin: 0; }
.entry  ol li{ list-style-type: decimal;  line-height: 1.5em;}
.entry  ol li ol li{ list-style-type: lower-alpha; }
.entry  ol li ul li{ list-style-type: disc; }

.entry table{
	width: 100%;
	border: 1px solid #ccc;
	border-collapse: collapse;
	margin: 0 0 15px 0;
}
.entry table td, .entry table th{
	border: 1px solid #ccc;
	padding: 5px;
}
.entry table th{
	background: #eee;
}

.article_block{
	width:100%;
	line-height:1.4em;
	padding: 0 0 37px;
}
.article_block a{
	text-decoration:underline;
}
.article_block a:hover{
	text-decoration:none;
}
div.article_block p{
	margin:0 0 20px 0;
	line-height:1.5;
	font-size:14px;
	text-align: left;
    line-height:2.15;
    font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 16px;
}
.main-news div.article_block{
  line-height:2.15;
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 16px;
}
.article_block h1{font-size: 28px;}  .article_block h2{font-size: 22px;}  .article_block h3{font-size: 18px;}  .article_block h4{}  .article_block h5{}  .article_block h6{}
.article_block h1, .article_block h2, .article_block h3, .article_block h4, .article_block h5, .article_block h6{
	line-height:1.5em;
	margin: 30px 0 20px;
	color: #000;
	font-weight: bold;
	text-align: left;
}
.article_block ul{ margin: 0 0 20px 0; padding: 0 0 0 30px; }
.article_block ul ul, .entry ul ol{ margin: 0; }
.article_block ul li{	list-style-type: disc;  line-height: 1.5em;}
.article_block ul ul li{ list-style-type: circle; }
.article_block  ul li ol li{ list-style-type: decimal; }

.article_block ol{ margin: 0 0 20px 0; padding: 0 0 0 30px; }
.article_block ol ol, .entry ol ul{ margin: 0; }
.article_block  ol li{ list-style-type: decimal;  line-height: 1.5em;}
.article_block  ol li ol li{ list-style-type: lower-alpha; }
.article_block  ol li ul li{ list-style-type: disc; }

.article_block table{
	width: 100%;
	border: 1px solid #ccc;
	border-collapse: collapse;
	margin: 0 0 15px 0;
}
.article_block table td, .entry table th{
	border: 1px solid #ccc;
	padding: 5px;
}
.article_block table th{
	background: #eee;
}

/* Calendar */
#os-calendar{width:95%;margin-bottom:15px;clear:both;padding:0;}
#os-calendar caption{padding:10px;}
#os-calendar th,#os-calendar td{text-align:center;padding:3px 0;}
#os-calendar td{background:transparent;}

/* Begin Images */
img{
	max-width: 100%;
	height: auto;
}
img.os-smiley{ padding: 0; border: none; }
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 20px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.os-caption {
    max-width: 96%; /* Image does not overflow the content area */
    padding: 0;
    text-align: center;
}

.os-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.os-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.os-caption.alignright {
    margin: 5px 0 20px 20px;
}

.os-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.os-caption p.os-caption-text, .entry .os-caption p.os-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 5px 4px 0;
}

.al{
	float: left;
}
.ar{
	float: right;
}

/* Various Tags & Classes */
.entry acronym, .entry abbr, .entry span.caps{
	cursor: help;
}
.entry acronym, .entry abbr{
	border-bottom: 1px dashed #dfcfba;
}
.entry blockquote{
	margin: 15px 0 20px 0;
	padding:0 15px 0 40px;
}
.entry blockquote cite{
	margin: 5px 0 0;
	display: block;
}
.center{
	text-align: center;
}
.hidden{
	display: none;
}
.entry pre, .entry code{
	font-family:mono-space,monospace;
	border: 1px solid #eee;
	padding: 20px;
	display: block;
	margin: 0 0 20px 0;
	overflow: auto;
	white-space: pre;
	font-size: 12px;
	line-height:20px;
}
.entry code{
	padding:1px 20px 0 20px;
	border-top: 0;
	border-bottom: 0;
}
sup{
	position: relative;
	top: -5px;
}
sub{
	position: relative;
	top: 5px;
}
code br{
	display: none;
}
.last{
	margin-right:0 !important;
	clear:right;
}
.clear{
	clear: both;
	line-height: 0;
}
.sticky{}
.bypostauthor{}
.page-link{
	padding: 0 0 15px;
}


/* pagination */
.pagination{
	width:100%;
	overflow:hidden;
	padding: 10px 0 20px 0;
}
.single .pagination{
}
.pagination a{
}


/* =========================== 新着情報 2014.09.28 ここから =========================== */

/* トップページ
/* page-templates/home.php
---------------------------*/

/* 全体の背景色 */
.main-news {
	background: #e9edf3;
}

/* 新着情報見出し */
.main-news h2 {
	//float: left;
	font-size: 28px;
	margin-bottom: 10px;
	color: #000;
	font-weight: normal;
}
.main-news a {
	word-break: break-all;
}
p.subtitle {
	float:left;
	margin-top:15px;
	padding:0 70px 0 35px;
	font-size: 14px;
	color: #888;
	background: url(images/borderGrey.png) no-repeat 100% 50%;
}

/* 一覧ボタン */
.main-news .btn {
	float:right;
	width: 167px;
}


/* 新着情報一覧(home.phpとarchive-whatsnew.phpから読み込み)
/* templates/block-news.php
---------------------------*/
#newsWrapper{
clear:both;
width:1016px;
margin-right:-15px;
padding-top:27px;
overflow:hidden;
}
#twoColumn #newsWrapper{width:715px;}

#newsWrapper .grid{
float:left;
clear:none;
width:239px;
height:245px;
margin:0 15px 15px 0;
padding:15px 0 !important;
padding:0;
overflow:hidden;
background:#fff;
}

#newsWrapper p,#newsWrapper h3{padding:0 15px;}

#newsWrapper .thumbImg{padding-bottom:12px;}

#newsWrapper .date {
	float: left;
  color: #a3a3a3;
	font:bold 14px/28px Arial, sans-serif;
}

#newsWrapper .cat{
	float: right;
	text-align:center;
}

.cat a {
	display: block;
	width: 105px;
	line-height: 28px;
	font-size: 10px;
	font-weight: bold;
	color: #fff;
	background: #00b4e7;
}

/* カテゴリ色別 */
.grid .wp a { background: #ff7e00; }
.catColor .wp a { color: #ff0042; }

.grid .cat-shufu a {	background: #ff0042; }
.catColor .cat-shufu a { color: #ff7e00; }

.grid .smartphone a {	background: #3dcb00;}
.catColor .smartphone a { color: #3dcb00; }

.grid .cat-plan a {	background: #ffba00; }
.catColor .cat-plan a { color: #e4a600; }

.grid .story a {	background: #982add; }
.catColor .story a { color: #982add; }

.catColor .latest a{ color: #009ee7; }
.catColor .news a { color: #009ee7; }

.catColor .press-release a { color: #0566f7; }
.catColor .press-release-en a { color: #0566f7; }

.catColor .catAll a { color: #666; }


#newsWrapper h3 {
	clear: both;
	padding: 12px 15px 5px !important;
}

#newsWrapper h3 a{
	display: block;
	font-size: 14px;
	font-weight: bold;
	color: #000;
}

#news a {
	color: #333;
	font-weight: bold;
	-webkit-transition: 0.3s ease-in-out;  
       -moz-transition: 0.3s ease-in-out;  
         -o-transition: 0.3s ease-in-out;  
            transition: 0.3s ease-in-out; 
}

#news a:hover {
	color: #707070;
	text-decoration: none;
}

#news {
	clear: both;
}

/* pagenav  */
.prev {float: left}
.next {float: right;}


/* 新着情報一覧
/* archive-whatsnew.php
---------------------------*/
.heading p.subtitle{
	margin-top:10px;
	padding:0 70px 0 0;
}

#newsCat {
	padding-bottom:23px;
	overflow:hidden;
}

#newsCat li {
	float: left;
	padding:0 20px; 
	text-align: center;
	border-right: 1px solid #888;
}

#newsCat li:first-child {
	border-left: 1px solid #888;
}

#newsCat {
	font-weight: bold;
}


/* 新着情報カテゴリー別記事一覧
/* single-news.php
---------------------------*/
#twoColumn {
	width: 1002px;
	margin: 0 auto;
	overflow: hidden;
	}

#content {
	float: left;
	width: 700px !important;
	padding: 60px 10px;
	color: #000;
	font-size: 14px;
}

#sidebar {
	float: right;
	width: 264px;
	padding: 62px 0 40px;
}

#sidebar h3 {
	margin-bottom: 10px;
	color: #000;
	font-size:12px;
	letter-spacing: .5em;
	}

#sidebar li {
	border-bottom:1px solid #ccc;
}

#sidebar li a {
	display: block;
	padding:15px 0;
}

#sidebar .latest li:last-child {
	margin-bottom: 35px;
}

#sidebar .catColor a{
	background: url(images/btn-arrow-black.png) no-repeat 250px 50%;
}

#content .title-page h2 {
	font-size: 24px;
	font-weight: bold;
	line-height:1.4;
	float: none;
}

#content .entry h2 {
	padding-bottom: 10px;
	margin-bottom: 30px;
	font-size: 22px;
	font-weight: bold;
	border-bottom: 2px solid #3dcb00;
}

#content .entry h4 {
	padding-left: 24px;
	background: url(images/dotGreen.png) no-repeat 0 4px;
}

#content .entry ul {
	padding-left: 5px !important;
}

#content .entry li {
	margin-bottom: 10px !important;
	padding-left: 10px;
	list-style: none;
	background: url(images/btn-arrow-black.png) no-repeat 0 10px;
}

#content .entry .link:after {
	padding-left: 15px;
	vertical-align:middle;
	content: url(images/externLink.png);
}

@media screen and (max-width:1024px){
	#newsWrapper, #twoColumn #newsWrapper{width:100%; margin:0; text-align:center;}

	#newsWrapper .grid{float:none; margin: 0 5px 15px; display:inline-block; text-align:left;}
	
	#twoColumn {width: 100%;}
	
	#content,#sidebar {float:none; width:100% !important;padding:20px 20px; -webkit-box-sizing: border-box; box-sizing: border-box;}
}	

@media screen and (max-width:640px){
	#newsWrapper .grid{width:100%; margin:0 0 15px;}
	#newsWrapper .grid img{display:block; margin: 0 auto;}
}

@media screen and (max-width:480px){
  .news-heading .btn {
		width: 100% !important;
		padding:0 20px;
		 -webkit-box-sizing: border-box; box-sizing: border-box;
	}
}
/* =========================== // 新着情報 2014.09.28 ここまで =========================== */


@media screen and (min-width:240px) and (max-width:1022px) {
	.map .label {display: none;}
	.decor-holder {height: 400px; background-position: 0 0;}	
}
@media screen and (min-width:240px) and (max-width:960px) {
	.decor-holder {height: 300px; background-position: 0 0;}
	#nav #magic-line,
	.nav-bar {display: none;}
	.btn-menu {display: block;}
	.header-holder {
		padding: 20px 20px 28px 20px;
	}
	.logo {margin: 0;}
	.nav-bar {
		width: 100%;
		background: #000;
		position: absolute;
		top: 100%;
		left: 0;
	}
	#nav li {
		width: 100%;
		float: none;
		background: none;
	}
	#nav a {
		padding: 10px;
		border-top: none;
	}
	#nav .actives a:hover,
	#nav a:hover,
	#nav .actives a {
		border:none;
		background: #00b4e7;
		color: #fff;
	}
	#nav a:hover {background:#00bf94;}
	#nav .contacts a {border: none;}
	.main-gallery {height: auto;}
}
@media screen and (min-width:240px) and (max-width:860px) {
	.main-heading .btn,
	.main-heading .title,
	/*.main-heading h2,*/
	.contact-block h2,
	.contact-block .contact-description,
	.contact-block .btn {float: none; margin: 0 0 20px; text-align: center;}
	.main-heading .btn,
	.contact-block .btn {width: auto;}
	p.subtitle {padding-left:15px !important;}
}
@media screen and (min-width:240px) and (max-width:860px) {
	.main-heading .title{
		display:none;
	}
}

@media screen and (min-width:240px) and (max-width:768px) {
	.promo-info {width: auto;}
	.page-details .main-heading .heading-content,
	.main-content {padding: 30px 20px;}
	.promo {min-height: 100%;}
	.promo-info {padding: 10% 0;}
	#map_canvas{
		height: 400px;
	}
	.decor-holder{
		background-attachment: scroll;
	}
}
@media screen and (min-width:240px) and (max-width:400px) {
	.promo {background:url(images/bg-circle-small.png) no-repeat 0 0;
}
@media screen and (min-width:240px) and (max-width:768px) {
	.heading-content{
		padding:45px 10px 43px 10px;
	}
}
@media screen and (min-width:240px) and (max-width:640px) {
	#map_canvas{
		height: 300px;
	}
	#bx-pager img {
		height: 40px;
	}
	.decor-holder {height: 200px; background-position: 0 0;}
	.panel-holder {text-align: center; padding:25px 20px;}
	.panel-holder .btn,
	.panel-holder .latest {
		float: none;
	}
	.panel-holder .latest {margin: 0 0 20px; font-size:24px;}
	.panel-holder .btn {width: 100%;}
	.info-list,
	.item-list ul {margin: 0;}
	.item-list ul li {
		float: none;
		width: 100%;
		padding: 0 0 30px;
		text-align: center;
	}
}
@media screen and (min-width:400px) and (max-width:640px) {
	.promo-info {
		font-size: 18px;
		line-height: 24px;
	}
	.promo-info h1 {
		font-size: 36px;
		line-height: 64px;
	}
	.promo-info h2 {
		font-size: 24px;
		line-height: 32px;
		margin: 0 0 18px;
	}
}
@media screen and (min-width:240px) and (max-width:399px) {
	.promo-info h1 {
		font-size:36px;
		line-height:1.5;
	}
	.promo-info h2 {
		font-size: 18px;
		line-height: 1.5;
		margin: 0 0 10px;
	}
	.promo-info p{
		font-size:14px;
		line-height:1.5;
	}
}

@media screen and (min-width:240px) and (max-width:480px) {
	#map_canvas{
		height: 200px;
	}
}

.fontWhite{
	color:#ffffff !important;
}

/*引用*/
blockquote{
    position: relative;
    margin: 0 1em 1.5em;
    padding: 1em;
    border: 3px solid #d7d7d7;
    background-color: #e0e0e0;
    z-index: 1;
}
 
blockquote p{
    position: relative;
    z-index: 3;
}
 
blockquote:before{
    content: "“";
    font-size: 1000%;
    line-height: 0.8em;
    font-family: 'Times New Roman' ,"ＭＳ Ｐゴシック" ,sans-serif;
    color: #F0F0F0;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

//bookmarklet
.bookmark {
	margin: 1em;
	padding: 2.1em 1em 2.1em;
}
.bookmark img {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
	box-shadow: none;
}
.bookmark figure {
	margin: 0;
	padding: 0;
	float: left;
	display: inline;
	border: none;
	background: none;
}
.bookmark figure img {
	float: left;
	display: inline;
	border: 2px solid #c72439;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	-o-border-radius: 0;
	border-radius: 0;
}
.bookmark_container {
	padding-left: 170px;
}
.bookmark header {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
}
.bookmark h3 {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
	display: inline;
	font-weight: normal;
}
.bookmark p {
	margin: 0 !important;
	padding: 5px 0 0 !important;
	width: auto;
	clear: none;
	font-size: 0.8em;
	color: #565656;
}
strong.yellow {
    background: linear-gradient(transparent 40%, #ffff66 40%);
}