@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
 
/* ---------------------------------------- /
/
/ 基本・共通設定
/
/ ---------------------------------------- */
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 { margin: 0; padding: 0; border: 0; font-style:normal; font-size: 100%; vertical-align: baseline;}

html,body { width:100%;/* min-width: 1280px; */height:100%; }

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
html{
	font-size: 62.5%; /*初期値16pxの62.5%でルートが10px*/
}
body {
	font-size: 1.4rem;
	font-family:  "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	-webkit-text-size-adjust: 100%;
	line-height:22px;
	margin:0;
	padding:0;
	color:#101010;
}
@media screen and (max-width: 967px) {

}
@media screen and (max-width: 768px) {
	html{
	font-size: 60%;
}
	body{
		padding-top:0;
	}
}
img { border:none; outline:none; vertical-align:top;}
ol, ul{ list-style:none;}
caption, th{ text-align: left;}
a:focus { outline:none;}

.clear{	clear:both;	}
.strong {  font-weight:bold;}
.text_r{ text-align:right;}
.texr_c { text-align:center;}
.f_left{ float:left;}
.f_right{ float:right;}

.clearfix:before,
.clearfix:after {
    content: " ";
	display: table;}
.clearfix:after {
    clear: both;
}

.fixed {
    position: fixed;
	top:0;
    left: 0;
    width: 100%;
	z-index:999;
}

/* ------- フォント・テキスト ------- */
a,a:visited{ color: #101010;text-decoration: none;	-webkit-transition: all 0.3s linear 0s;-o-transition: all 0.3s linear 0s;transition: all 0.3s linear 0s;}
a:hover,a:active{ color: #aaa; text-decoration: none;}

::selection {background: #fec37a; color: #101010;}
::-moz-selection {background: #fec37a; color: #101010;}

.title_text{
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:500;
}
.serif{	font-family: "游明朝", YuMincho,  "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;}

.strong_orange { color:#e07c00; font-weight:bold; font-size:1.8rem;}
.font_orage{ font-weight:bold; color:#e07c00;}
.small{ font-size:1.3rem;}
.b_red{ font-size:2.6rem; color:#ff0000;}

.contents01 a,.contents01 a:visited,.contents02 a,.contents02 a:visited,.contents03 a,.contents03 a:visited,.contents04 a,.contents04 a:visited,.contents05 a,.contents05 a:visited{
	 color: #e07c00;
	 border-bottom: 1px dotted #e07c00;
}
.border_none a{ border-bottom:none !important;}

.contents01 a:hover,.contents01 a:active,.contents02 a:hover,.contents02 a:active,.contents03 a:hover,.contents03 a:active,.contents04 a:hover,.contents04 a:active,.contents05 a:hover,.contents05 a:active{
	 color: #101010;
	 border-bottom: 1px dotted #e07c00;
}
/* --------------　透過　------------------ */

a:hover img{
	opacity: 0.6;
	-moz-opacity: 0.6;
	filter: alpha(opacity = 60);
	-webkit-transition: all 0.3s linear 0s;
	-o-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
.none a:hover img{
	opacity: 10;
	-moz-opacity: 10;
	filter: alpha(opacity = 0);
	-webkit-transition: all 0.3s linear 0s;
	-o-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}

/* --------------　シャドウ　------------------ */
.shadow1{
	-moz-box-shadow:rgba(10, 10, 10, 0.3) 0px 0px 5px 1px;
	-webkit-box-shadow:rgba(10, 10, 10, 0.3) 0px 0px 5px 1px;
	box-shadow:rgba(10, 10, 10, 0.3) 0px 0px 5px 1px;
}
.shadow2{
	box-shadow:2px 2px 3px 1px rgba(0,0,0,0.2);
	-moz-box-shadow:2px 2px 3px 1px rgba(0,0,0,0.2);
	-webkit-box-shadow:2px 2px 3px 1px rgba(0,0,0,0.2);
}
.shadow3{
	box-shadow:0px 4px 8px -4px rgba(0,0,0,0.5);
	-moz-box-shadow:0px 4px 8px -4px rgba(0,0,0,0.5);
	-webkit-box-shadow:0px 4px 8px -4px rgba(0,0,0,0.5);
}

/* --------------　box　------------------ */
.contents01,.contents02,.contents03,.contents04,.contents05,.contents06,.contents07{
	padding:40px 0 10px 0;
}
.small_section{
	margin-bottom:3rem;
}
.gray_border{
	height:100%;
	border: 4px solid #f2f2f2;
	padding: 1.6rem 2rem;
}
.gray_box{
	background-color: #f2f2f2;
}
.blue_box{
	background-color:#e4f6fe;
	padding: 1.6rem 2rem;
}
.blue_box .case_title{
	font-weight:bold;
	color:#50adda;
}
.inner_text{
	padding: 0 15px;
}
/* --------------　見出し　------------------ */
.title_orange{
	font-size: 2.4rem;
	line-height:2.4rem;
	border-bottom: 1px solid #e07c00;
	margin-bottom:1.2em;
}
.title_orange span{
	display:inline-block;
	border-bottom: 4px solid #e07c00;
	padding-bottom: 0.4em;
}
.title_orange_bg{
	background-color:#f9e5cc;
	text-align:center;
	padding:2rem 0;
	margin-bottom:1.3rem;
}
.title_orange_bg img{
	width:100%;
	max-width:370px;
	height:auto;
}
.title_orange_dot{
	font-size:1.6rem;
	line-height:1.6rem;
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	border-bottom: 2px dotted #e07c00;
	padding-bottom:0.3em;
	margin-bottom:0.3em;
	font-weight:500;
}
.title_orange_dot:before{
	content: "";
	width:6px;
	height:1.6rem;
	vertical-align:top;
	background-color:#e07c00;
	position:relative;
	left:6px;
	bottom:0;
	margin-right:0.7em;
	display:inline-block;
}
/* --------------　btn　------------------ */
.btn_large,.btn_medium,.btn_small,.btn_open{
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:500;
	color:#fff;
	width:100%;
	-moz-box-shadow:3px 3px 0px 1px #6d3c00;
	-webkit-box-shadow:3px 3px 0px 1px #6d3c00;
	box-shadow:3px 3px 0px 1px #6d3c00;
	margin-bottom:1em;
	}
.btn_large a,.btn_medium a,.btn_small a,.btn_open a,
.btn_large a:visited,.btn_medium a:visited,.btn_small a:visited,.btn_open a:visited{
	color:#fff;
	display:block;
	width:100%;
	height:100%;
	border-bottom:none;
	padding: 0.7em 0.7em;
	background-color:#e07c00;
	position:relative;
}
.btn_large a:hover,.btn_medium a:hover,.btn_small a:hover,.btn_open a:hover,
.btn_large a:active,.btn_medium a:active,.btn_small a:active,.btn_open a:active{
	color:#fff;
	display:block;
	width:100%;
	height:100%;
	border-bottom:none;
	background-color:#ee9527;
}
.btn_large a:after,.btn_medium a:after,.btn_small a:after{
	content:url("../img/btn_arrow.png");
	position:absolute;
	right:0.7em;
}
.btn_large{
}
.btn_medium{
	font-size:1.8rem;
	line-height: 1.8rem;
}
.btn_small{
	font-size:1.4rem;
}
/* --------------　テーブル　------------------ */
table{
	width:100%;
	font-size:1.3rem;
	margin: 1rem 0;
}
table tr{
	border-top: 1px dotted #a2a1a1;
}
table th{
	text-align:center;
	font-weight:normal;
	padding:1em 0.5em;
	vertical-align:middle;
}
table td{
	padding:1em 0.5em;
	vertical-align:middle;
}
table .bg_color01{
	background-color:#e4f6fe;
}
table .bg_color02{
	background-color:#effbff;
}

input[type="text"],
textarea {
	width:100%;
	font-size:1.3rem;
	outline: none;
	border: 1px solid #ddd;
	-webkit-transition: all .3s;
	transition: all .3s;
	padding: 0.3em;
}
input[type="number"] ,select{
	border: 1px solid #ddd;
}
input[type="text"]:focus,
textarea:focus,
input[type="number"]:focus,
select:focus{
	box-shadow: 0 0 4px #E07C00;
	border: 1px solid #E07C00;
}
table ul li{
	display:inline;
	margin-right:1em;
}
.form_btn{
	text-align:center;
}
input[type="submit"],
input[type="reset"]{
	border:1px solid #E07C00;
	background-color: #E07C00;
	color: #fff;
	padding: 0.5em 2em;
	-webkit-transition: all 0.3s linear 0s;
	-o-transition: all 0.3s linear 0s;
	transition: all 0.3s linear 0s;
}
input[type="submit"]:hover,
input[type="reset"]:hover{
	border:1px solid #E07C00;
	background-color: #fff;
	color: #E07C00;
	padding: 0.5em 2em;
}
@media screen and (max-width: 768px) {
	input[type="number"] ,select{
		width:100%;
	}
	table tr{
		border-top:none;
		}
	table th,table td{
		width:100%;
		display:block;
		padding:0.5em;
		}
	table .bg_color02{
		background-color:#e4f6fe;
		}
}
/* --------------　アコーディオン　------------------ */
.subInner {
    display:none;
	padding: 1em 0;
}
.subContent .accordion_title{
	border-top: 1px solid #e07c00;
	border-bottom: 1px solid #e07c00;
	font-size:2.2rem;
	padding: 0.5em 1em;
	position:relative;
	cursor:pointer;
}
.subContent .accordion_title:before{
	content: " ";
	display:inline-block;
	width:1rem;
	height:1em;
	background-color:#e07c00;
	position:absolute;
	left:0.4rem;
}
.subContent .accordion_title:after {
	position:absolute;
	right:0.5em;
	top: 36%;
    display: inline-block;
    content: " ";
	background:url(../img/accordion_arrow_down.png) no-repeat top center;
	-moz-background-size:cover;
	background-size:cover;
	width:2rem;
	height:1.2rem;
	transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.subContent .open:after{
	transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}
.subContent .close{
	cursor:pointer;
	text-align:right;
}
.subContent .close span{
	color:#fff;
	font-weight:bold;
	border: 1px solid #e07c00;
	background-color:#e07c00;
	border-radius:3px;
	padding: 0 0.5em;
}
@media screen and (max-width: 768px) {
	.subInner{
		padding: 1em 0;
}
}
/* --------------　定義リスト　------------------ */
dl{

}
dt{

}
dd{
}

/* header
=============================================================================*/
.header{
	width:100%;
	height:70px;
	background-color:#fff;
}
.header_inner{
	max-width:1170px;
	margin: 0 auto;
}
.header_inner h1{
	float:left;
	padding-top:13px;
}
.header_inner ul{
	float:right;
}
.header_inner ul li{
	float:left;
	height:70px;
	padding-top:20px;
}
.header_inner ul li a{
	display: inline-block;
	width:100%;
	height: 70px;
}
.header_inner ul li img{
	float:left;
	padding: 0 16px;
	border-right: 1px solid #dfdfdf;
}
@media screen and (max-width: 992px) {
	.header_inner h1{
		float:left;
		padding-top:16px;
		padding-left:6px;
		width:164px;
		}
	.header_inner h1 img{
		width:100%;
		height:auto;
		}
	.header_inner ul li img{
		padding: 0 6px;
		}
}
/* --------------　header-sp　------------------ */
.header-sp{
	display:none;
}
@media screen and (max-width: 768px) {
	.header{
		visibility: hidden;
		height:0;	
		}
	.header-sp{
		display:block;
		}
	.menu-btn {
		position: fixed;
		top: 10px;
		right: 20px;
		width: 50px;
		height: 40px;
		line-height: 40px;
		font-size: 12px;
		text-align: center;
		cursor: pointer;
		z-index: 1;
		border-top:2px solid #fff;
		border-bottom:2px solid #fff;
		}
	.menu-btn span {
		color: #fff;
		font-weight:bold;
		}
	.menu-btn span:after {
		content: attr(data-txt-menu);
		}

/* 開閉用ボタンがクリックされた時のスタイル */
	.open .menu-btn span:after {
    	content: attr(data-txt-close);
		}
	.menu {
    	position: fixed;
    	display: table;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
	background: -webkit-linear-gradient(45deg, rgba(255,210,60,1) 1%, rgba(255,210,60,1) 40%, rgba(255,210,60,1) 40%, rgba(228,142,24,1) 100%);
	background: -moz-linear-gradient(45deg, rgba(255,210,60,1) 1%, rgba(255,210,60,1) 40%, rgba(255,210,60,1) 40%, rgba(228,142,24,1) 100%);
	background: -o-linear-gradient(45deg, rgba(255,210,60,1) 1%, rgba(255,210,60,1) 40%, rgba(255,210,60,1) 40%, rgba(228,142,24,1) 100%);
	background: linear-gradient(45deg, rgba(255,210,60,1) 1%, rgba(255,210,60,1) 40%, rgba(255,210,60,1) 40%, rgba(228,142,24,1) 100%);
		-webkit-transition: all .5s;
    	transition: all .5s;
    	visibility: hidden;
    	opacity: 0;
		}

	.menu ul {
    	display: table-cell;
    	vertical-align: middle;
		}

	.menu li {
    	width: 80%;
    	height: 2.5em;
    	line-height: 2.5em;
    	margin: 0 auto;
		margin-bottom:0.5em;
    	text-align: center;
		border: 1px solid rgba(255,255,255,0.8);
		background: rgba(255,255,255,0.1);
		}

	.menu li a {
    	display: block;
    	font-size: 16px;
    	color: #fff;
		font-weight:bold;
		}

	.menu li a:hover {
    	color: #999;
		}
	.menu li.sub_menu{
		border:none;
		height: 0.5em;
    	line-height: 0.5em;
		background: none;
		float:left;
		width:50%;
		margin-top:1em;
		}
	.menu li.sub_menu a{
		font-size:12px;
		}
/* 開閉用ボタンがクリックされた時のスタイル */
	.open .menu {
    	cursor: url(../images/cross.svg),auto;
    	-webkit-transition: all .5s;
    	transition: all .5s;
    	visibility: visible;
    	opacity: 1;
		}
}

/* footer
=============================================================================*/
.footer{
	max-width:1170px;
	margin: 0 auto;
	font-size:1.3rem;
	padding: 20px 0;
}
.footer ul{
	float:left;
	margin-right:30px;
}
.footer ul li{
	background:url(../img/footer_arrow.png) no-repeat left 50%;
	padding: 6px 16px;
}
.pagetop{
	width:100%;
	padding:10px 0 5px 0;
	text-align:center;
	border-top: 1px solid #c6c6c6;
	border-bottom: 1px solid #c6c6c6;
}
.footer_contacts{
	width:470px;
	float:right;
	border: 1px solid #c6c6c6;
	padding: 20px 10px;
	margin-top:10px;
	background-color:#f7f7f7;
	color:#4b4b4b;
}
.footer_contacts .footer_title{
	width:132px;
	float:left;
	padding: 8px 0 0 14px;
}
.footer_contacts .footer_tel{
	width:260px;
	float:right;
	font-size:22px;
	padding-left:13px;
	margin-bottom:10px;
}
.footer_contacts .footer_tel:before{
	content: url("../img/footer_tel_icon.png");
	margin-right:6px;
}
.footer_contacts .footer_mail{
	width:260px;
	float:right;
	font-size:18px;
	padding-left:13px;
}
.footer_contacts .footer_mail:before{
	content: url("../img/footer_mail_icon.png");
	margin-right:6px;
}
.adress{
	text-align:right;
	font-size: 1.2rem;
	clear:right;
}
.copy{
	text-align:center;
	background-color:#e07c00;
	color: #fff;
	font-size: 1rem;
}
/*社内タブレット（縦）対策*/
@media screen and (min-width:769px) and (max-width:1010px) {
	.footer{
		padding: 0 10px;
		}
	.footer ul{
		width:33.33%;
		margin-right:0;
		}
	.footer_contacts{
		width:100%;
		clear:both;
		float:none;
		text-align:center;
		padding: 10px;
		}
	.footer_contacts .footer_title{
		width:132px;
		float:none;
		display:inline;
		padding: 8px 0 0 14px;
		}
	.footer_contacts .footer_tel{
		width:auto;
		float:none;
		display:inline;
		font-size:22px;
		padding-left:30px;
		margin-bottom:10px;
		padding-top:6px;
		}
	.footer_contacts .footer_mail{
		width:auto;
		float:none;
		display:inline;
		font-size:18px;
		padding-left:30px;
		padding-top:6px;
		}
}
@media screen and (max-width: 768px) {
	.footer ul{
		display:none;
		}
	.footer{
		padding: 0 15px;
		}
	.footer_contacts{
		width:100%;
		float:none;
		text-align:center;
		padding: 10px;
		}
	.footer_contacts .footer_title{
		width:100%;
		float:left;
		padding: 0 0 8px 14px;
		}
	.footer_contacts .footer_tel,.footer_contacts .footer_mail{
		width:100%;
		float:none;
		padding-left:0;
		}
}
/* slick.js
=============================================================================*/
.service_slider img,.portfolio_slider img{
	width:100%;
	height:auto;
}
.service_slider_wp h2{
	margin-bottom:30px;
	text-align:center;
}
@media screen and (max-width: 768px) {
	.service_slider_wp h2 img{
		width:100%;
		}
}
/*制作実績*/
.portfolio_slider .img{
	overflow:hidden;
}
.portfolio_slider img{
	width:100%;
	height:auto;
}
.portfolio_slider .inner_img p{
	display:none;
}
.portfolio_slider .news{
	position:relative;
}
.portfolio_slider .slider_p{
	background-color: rgba(0,0,0,0.5);
	color:#fff;
	width:100%;
	padding: 0.3em 0.5em;
	position: absolute;
	bottom:0;
}
/* 下層ページ共通
=============================================================================*/
.sub_page .service_slider_wp {
	border-top: 1px solid #c6c6c6;
	padding: 40px 0 50px 0;
}
.contents_banner{
	width:100%;
	max-width:970px;
	margin: 0 auto;
	margin-bottom:3rem;
	padding: 0 15px;
}
.contents_banner img{
	width:100%;
	-moz-box-shadow:3px 3px 0px 2px #6d3c00;
	-webkit-box-shadow:3px 3px 0px 2px #6d3c00;
	box-shadow:3px 3px 0px 2px #6d3c00;
}
.contents_banner a{
	border-bottom:none;
}
.contents_banner a:hover{
	border-bottom:none;
}	

/* --------------　ページタイトル　------------------ */
.pagetitle{
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	width:100%;
	font-size: 3.2rem;
	line-height:3.2rem;
	color:#fff;
	text-align:center;
	background:url(../img/index/point_bg.jpg) no-repeat top center;
	-moz-background-size: cover;
	background-size: cover;
	padding: 1em 0;
}
.pagetitle h2{
	font-weight:normal;
}
.pagetitle span{
	margin-left:1em;
	font-size:1.8rem;
	border: 1px solid rgba(255,255,255,0.8);
	background-color: rgba(255,255,255,0.2);
	padding: 0 0.5em;
	vertical-align:middle;
}
@media screen and (max-width: 768px) {
	.pagetitle{
		padding-top:58px;
		text-align:center;
	}
	.pagetitle span{
		display:block;
		width:10em;
		margin: 0 auto;
		margin-top:1em;
}
}
/* --------------　パン屑リスト　------------------ */
.p_list{
	max-width:1170px;
	padding: 0 15px;
	margin: 0 auto;
	font-size: 1rem;
}
.p_list li:first-child:before{
	content: url("../img/p_list_icon.png");
	margin-right: 0.5em;
}
.p_list li{
	display: inline-block;
}
.p_list li:after{
	content: ">";
	margin: 0 0.5em;
}
.p_list li:last-child:after{
	content: "";
}
.p_list li.p_here a,.p_list li.p_here a:visited{
	color:#e07c00;
}
/* --------------　メインタイトル　------------------ */
.sub_page .contents01 h3.main_title{
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	font-size:3.2rem;
	line-height:3.2rem;
	text-align:center;
	font-weight:normal;
	margin-bottom:0.3em;
}
.sub_page .main_text{
	font-family: 'Noto Sans Japanese',"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:500;
	font-size:2.2rem;
	line-height:2.2rem;
	text-align:center;
	color:#e07c00;
}
.sub_page .sub_text{
	text-align:center;
	margin-top:0.5em;
}
/* メモ
=============================================================================*/
/*社内タブレットに合わせる為、動画のみ1280pxで非表示*/
@media screen and (max-width: 1280px) {
}
/*タブレット*/
@media screen and (max-width: 967px) {

}

/*スマホ*/
@media screen and (max-width: 768px) {

}