/*
Theme Name: yms
Template: twentythirteen
Author: ibs
*/

html{
	overflow-x: hidden;
}

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin: 0;
}



#contents{
	position: relative;
	min-height: 100%;
}


#body{
	width: 960px;
	margin: 10px auto 0;
	padding-bottom: 450px;
}

.clearfix:after {
    display:block;
    clear:both;
    height:0px;
    visibility:hidden;
    content:".";
}

.clearfix {
    min-height: 1px; /*IE6、7対策*/
}


.kai {
	page-break-before: always;
}

#home{
	background-color:#fff;
}

#header{
	margin:0;
	padding:0;
    z-index: 99;
    width: 100%;
}

#service {
	margin: 0 auto;
	width: 620px;
	height:auto;
	text-align:left;
}

#service p {
	line-height:1.8;
	font-size:16px;
}


#service p img {
	margin: 20px auto;
	width: 150px;
}

#service .signe {
	text-align: right;
	line-height: 60px;
}

#consult,#netshop,#develop{
	padding-top:10px;
	margin: 0 12px;
	/* width: 766px; */
	text-align:left;
}


#consult p{
	margin:0 60px;
	font-size:14px;
	line-height:1.6;
}

#consult img.midasi,#develop img.midasi{
	margin:10px 0;
}

#consult p.title{
	margin:20px 0 0 0;
	font-size: 20px;
    line-height: 1.6;
	padding:0 60px 20px 60px;
	padding-bottom:20px;
	position:relative;
	background:url(./images/line_b.png) 0 30px no-repeat;
	background-size:contain;
}

#develop p {
	margin:0 60px;
	font-size:14px;
	line-height:1.6;
}

#develop dl{
	float:left;
	width:50%;
}

#develop dl:nth-child(2n){
	clear:left;
}

#develop dt.title{
	margin:20px 0 0 0;
	font-size: 18px;
	text-align:center;
    line-height: 1.6;
	/* padding:0 10px 10px 10px; */
	padding-bottom:20px;
	position:relative;
	background:url(./images/line_s.png) 10px 20px no-repeat;
	background-size:90%;
	/* background-position:center; */
}

#netshop .inner__box {
  display: flex;
	justify-content: space-between;
}

#netshop div.b3{
	width: 32%;
	height:350px;
}

.b3:nth-child(1){
	background:url(./images/01.png) 0 0 no-repeat;
	background-size:contain;
}


.b3:nth-child(1) h2{
	background:url(./images/01_.png) 0 0 no-repeat;
	background-size:contain;
	background-position:center;
}

.b3:nth-child(2){
	background:url(./images/02.png) 0 0 no-repeat;
	background-size:contain;
}


.b3:nth-child(2) h2{
	background:url(./images/02_.png) 0 0 no-repeat;
	background-size:contain;
	background-position:center;
}

.b3:nth-child(3){
	background:url(./images/03.png) 0 0 no-repeat;
	background-size:contain;
}

.b3:nth-child(3) h2{
	background:url(./images/03_.png) 0 0 no-repeat;
	background-size:contain;
	background-position:center;
}

#netshop h1{
	color:#fff;
	font-size: 6em;
    font-weight: 100;
	margin-bottom: 0;
}

#netshop h2{
	color:#fff;
	font-size: 1.2em;
    margin-top: 4.5em;
    margin-bottom: 0.3em;
	text-align:center;
}

#netshop li{
	text-indent:3em;
	color:#fff;
	font-size: .9em;
    line-height: 1.4em;
}

#head-img {
	/* height: 0;
  padding-top: 41.27%;
  background: url(./images/header.png) 0 0 no-repeat;
  background-size:contain; */
	height: 350px;
	width: 260px;
	margin: auto;
	/* background:none; */
	background: url(./images/fastcom_logo.png) 0 0 no-repeat;
	/* position: relative; */
}


#works {
	margin: 0 auto;
	width: 766px;
	height:320px;
    background: url(./images/service_x.jpg) 0 0 no-repeat;
    background-size:contain;
	background-position:center;
}

#menu{
	/*margin: -20px auto 0 auto;*/
	margin: -120px auto 0 auto;
	height: 140px;
	width: 550px;
}

li{
	list-style:none;
}

#menu ul{
	padding:10px 0;
	height:120px;
}

#menu li{
	margin: 0 5px;
	width: 100px;
	height: 100px;
	float: left;
}

#menu li a{
	width: 100px;
	height: 100px;
	float: left;
}

#works .inner__box {
	height: 320px;
	display: flex;
}

#works .inner__left {
    color: #fff;
    padding-top: 60px;
    width: 50%;
		position: relative;
}

#works .inner__right {
    padding-top: 60px;
    width: 50%;
		position: relative;
}

.inner__txt {
	margin: auto 1.5rem;
	font-size:14px;
}

/* 「 ⋁ 」画像 */
#works img {
	/* width:auto; */
	height: auto;
	width:40px;
	margin-top:50px;
	margin-left:140px;
}

#works .inner__left:hover > p img{
	opacity:0.5;
}

#works .inner__right:hover > p img{
	opacity:0.5;
}

#works a,#works a{
	position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    text-indent:-999px;
}

#works p.sironeko{
	font-size:20px;
	text-shadow: 1px 1px 1px #999999;
	margin-bottom:20px;
	line-height:1.2;
}

#works p.kuroneko{
	font-size:20px;
	text-shadow: 1px 1px 1px #999999;
	margin-bottom:20px;
	line-height:1.2;
}

#works .inner__txt .txt__detail {
	line-height:1.6;
}

#footer-img{
	width:100%;               /* 横の幅を100% */
	height: 429px;            /* 縦の幅を120px */
	position: absolute;       /* 絶対位置指定することを定義 */
	bottom: 0px;              /* 絶対位置指定(左0px,下0px) */
	/* padding: 10px 0;          上下に余白を取る */
	/*height: 0;*/
  /*padding-top: 19.36%;*/
	background: url(./images/footer2.png) 0 0 no-repeat;
}

#footer{
	/* height: 250px; */
	/* width: 100%; */
	/* margin: auto;
	background:none;
	background: url(./images/fastcom_logo.png) 0 0 no-repeat; */
	/* position: relative; */
}

.ft__wrapper {
	margin-top: 6rem;
}

#footer ul{
	display: flex;
	justify-content: center;
	padding-left: 0px;        /* ulタグはリストを作るためのタグであり、左側に余白が必然的に生じるため制御 */
}

#footer li{
	color:#fff;

}

#footer li a{
	color:#fff;
}

#footer li a:hover{
	color: #330066;
}

.ft__copyright {
	/* padding-top:320px; */
	text-align:center;
	font-size:1em;
	color:#fff;
	clear:left;
	margin-top: 8rem;
}

/* footer_logo */
/* #footer_logo{
	max-width: 2200px;
	width:auto;
	height: auto;
	clear:both;
}

#footer_logo.parent{
	overflow: hidden;
	zoom: 1;
}

#footer_logo.child{
	float: left;
} */


/* img */
img {
	max-width: 100%;
	height: auto;
	margin: 0;
	width /***/: auto;
}



@media screen and (max-width:1020px) {
	#footer{
		/* position: static; */
	}
}

@media screen and (max-width: 768px) { /* スクリーンサイズが767px以下の場合に適用 */
	#footer{
		
	}
}

/*
#menu li a:hover{
	opacity: 0.55;
}
*/

/*////////// ページ編集CSS //////////*/
#page {
	margin: 5px auto;
	border-top: 4px gray solid;
	border-bottom: 4px gray solid;
}


/* トップページ */
#top_img {
	background: url("../images/main.jpg") no-repeat center top;
	height:400px;
}
#top_font {
	background: url("../images/main_word.png") no-repeat center center;
	height:400px;
	width: 1400px;
	position: relative;

}
#main {
	width: 960px;
	margin: 20px auto;
	padding: 30px 0px;
}

#left_img {
	background: url("../images/ssh_top_greeting.png") no-repeat center center #FFF;
	height:350px;
	width: 400px;
}
#main_left {
	border-bottom: solid 1px #024897;
	padding-bottom: 30px;
	width: 400px;
	float: left;
	margin-right: 50px;
}
#main_right {
	margin-left: 50px;
	width: 450px;
	float: left;
}
#right_img {
	height: 200px;
	padding-bottom: 40px;
}
#right_r_img:hover {
	opacity: 0.55;
	background-color: rgba(255,255,255,0.5);
}
#right_l_img:hover {
	opacity: 0.55;
	background-color: rgba(255,255,255,0.5);
}
#right_r_img {
	background: url("../images/ssh_top_button01.png") no-repeat center center;
	width: 200px;
	height: 200px;
	float: left;
	margin-right: 20px;
}
#right_l_img {
	background: url("../images/ssh_top_button02.png") no-repeat center center;
	width: 200px;
	height: 200px;
	float: left;
	margin-left: 20px;
}
#top_news h1{
	background: url("../images/ssh_top_news.png") no-repeat top left;
	height: 50px;
}
#news_list li{
	padding-bottom: 40px;
	border-bottom: solid 1px #024897;
}
#news_list li a{
	text-decoration: none;
}
.li_data {
	color: #024897;
	float: left;
	width: 150px;
	font-weight: bold;
}
.li_title {
	float: left;
	width: 300px;
}
/* 各種ページ用 */
#page_index {
	width: 200px;
}
#page_index img{
	float: left;
}
#page_index p{
	font-weight: bold;
	float: right;
	font-size: 0.5em;
}
.cont_left {
	width: 250px;
	float: left;
	margin-right: 10px;
	height: 500px;
}
.cont_right {
	width: 650px;
	float: left;
}
/* GoogleMAP */
iframe {
	margin: 0px auto 40px;
	width: 960px;
	/* margin-top: -50px; */
}
#about_table tr {
	border-bottom:  solid 1px #CCC;
}
#about_table {
	border-top: solid 2px #024897;
	border-bottom: solid 2px #024897;
	width: 700px;
}
#about_table tr th{
	padding: 20px 0px;
	vertical-align: top;
	width: 150px;
	color: #024897;
	font-weight: bold;
}

#about_table tr td{
	padding: 20px 0px;
}

#services_list li{
	font-size: 0.9em;
	padding: 5px 0px;
}
/* サービス */

.service_li {
	padding-left: 30px;
}

/* ニュース */
#news_view {
	border-top: solid 2px #024897;
	border-bottom: solid 2px #024897;
	width: 700px;
	padding: 15px 0px;
}


/* フッター */
/*
#footer {
	clear: both;
	width: auto;
	height: 150px;
	margin: 10px auto;
	padding: 30px 0px;
	background: #FFF;
}
*/

#p_mark {
	position: absolute;
	top: 15%;
	right: 40px;
}
#p_mark a img {
	width: 80%;
}

.foot_logo_name {
	background: url("../images/ssh_footer_copy.png") no-repeat center left;
	width: 380px;
	height: 150px;
	float: right;
}
.foot_logo {
	background: url("../images/ssh_footer_logo.png") no-repeat center right;
	width: 380px;
	height: 150px;
}
.foot_an li{
	margin-top: 70px;
	float: left;
	border-right: 1px solid #CCC;
}
.foot_an li a{
	font-size: 0.7em;
	color: #CCC;
	text-decoration: none;
	padding-left: 10px;
	padding-right: 40px;
}
.foot_an li:nth-child(5){
	border-right: 0px;
}
.foot_an li a:hover{
	color: #330066;
}

#about .dot {
    display: block;
    float: left;
}

#about dl dt {
    text-align: left;
}

#about dl dt {
	color:#270F88;
	font-weight:bold;
	text-indent:1em;
    width:10em;
}

/* フォーム */
.f_title {
	padding-bottom: 10px;
}
form {
	margin-top: 30px;
}
.f_text {
	width: 100%;
	padding: 5px 0px;
}
.f_send {
	text-align: right;
}
.f_send input{
	border: 0px;
	padding: 5px 3px;
	background: #024897;
	color: white;
	text-align: right;
}
.f_text input {
	width: 100%;
}
.f_text textarea {
	width: 100%;
	height: 100px;
	overflow: auto;
	resize: none;
}

.shd{
    width:40px;
    font-size:20px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    /*padding:8px 0 10px;*/
    color:#fff;
    background-color:#024897;
    border-radius:5px;
	box-shadow:2px 2px #555;
	letter-spacing: 0.5em;
}

/* ↓お知らせ追加CSS */
.news {
    margin: -45px auto;
    position: absolute;
    font-weight: bolder;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* ポリシーページ */
.privacy-policy {
font-family:'ＭＳ Ｐゴシック';
font-size:13pt;
font-weight:bold;
color:#3366cc;
}
.separator-overline {
	/* margin-top:0pt; */
	margin-bottom:0pt;
	line-height:130%;
	border-top:0.75pt solid #aaaaaa;
	padding-top:15pt;
}

.separator-underline{
	margin-left:36pt;
	margin-bottom:11.25pt;
	border-top:0.75pt solid #aaaaaa;
	clear:both;
}

.wrapper__box {
	margin-top: 3rem;
}

.policy .wrapper__box {
	margin: 2rem 0;
}

.inner__txt__space {
	margin-top:0pt;
	margin-bottom:7.5pt;
	line-height:130%;
	font-size:12pt
}

.lower__space {
	margin-bottom: 5rem;
}

.txt__white {
	/* font-family:'ＭＳ Ｐゴシック'; */
	font-weight:bold;
	color:#ffffff
}

.policy-item {
	margin-top:7.5pt;
	margin-bottom:7.5pt;
	line-height:130%;
	font-size:12pt;
	background-color:#999999;
	padding:5pt
}

.flex_list {
	display: flex;
	border-top: 1px solid #aaaaaa;
	padding: 1.25rem 0;
}

.flex_list dt {
	width: 200px;
	font-weight: bold;
}

/* ABOUT 事業内容 2行目インデント */
.txt__indent li{
	text-indent: -1em;
  padding-left: 6em;
}


/* レスポンシブ対応 */
@media screen and (max-width: 768px) { /* スクリーンサイズが767px以下の場合に適用 */
	#body{
		width: 100%;
	}

	#works {
		width: 100%;
	}

	#netshop .inner__box .b3 ul {
		padding-left: 10px;
	}
} 

@media screen and (max-width: 375px) { /* スクリーンサイズが375px以下の場合に適用 */
  #menu {
		width: 100%;
	}

	#menu li img {
		width: 60%;
	}



	#develop dl {
		width: 100%;
	}
}