﻿/*

content.css
ver2017.10.27

10.27 対応OSをanywhere.cssから抜粋し、共通スタイルに
10.26 218- 横並びコンテンツが2個の場合を追加
10.23 ボーダースタイル追加
10.19 vega3000料金ページにページ内リンクリストを作成したため、link-listでまとめる
06.01 436- #antisocial追加
12.20 198- feature-wrap leadタグ修正
12.09 フォントサイズ変更によるキービジュアル縦幅調整
12.01 アプリバナーWin10修正
11.30 /news/　ニュースページ年代別アーカイブ用プルダウン調整
11.17 Uplatformコンテンツ追加のための調整
9.28 261-アプリバナー追加

*/

#wrap {
	margin-bottom: 70px;}


/* === コンテンツエリア === */

#contentArea h1,#contentArea-large h1 { 
font-size: 34px;
margin: 48px 0;
}

#contentArea h2,#contentArea-large h2 { 
font-size: 30px;
margin: 20px 0;
}

#contentArea h3 { 
font-size: 16px;
margin: 10px 0;
font-weight: bold;
}

#contentArea h3:before {
	content:"・" ;
	color: #aaa ;
	font-size: 20px;}
	

/*--- キービジュアル ---*/

#contentArea-large .main { 
margin: -2px 0 0;
height: 442px;}

#contentArea-large .main-inner {
	width: 980px;
	margin: 0 auto;
	}

#contentArea-large　.main-inner .title-area {
	width: 500px;
	padding: 50px 0;
	font-size: 15px;
	line-height: 1.8}
	
#contentArea-large .main-inner h1 {
	margin: 0 0 25px;
	font-size: 38px;
	letter-spacing: 1.5px;
}	


#contentArea-large .main-inner .title-area .price {
	margin: 1.5em 0;}

#contentArea-large  .main-inner .title-area .price .kakaku
{
	color: #222;
	margin-right: 17px;}

#contentArea-large .main-inner .title-area .price .dinf {
	font-size: 250%;
	letter-spacing: -1px;}
	

#contentArea-large .main-inner .title-area {
	width: 500px;
	padding: 55px 0;
	font-size: 16px;
	line-height: 1.8}	


#contentArea-large .main-inner .title-area a {
display: inline-block;
margin-right: 60px;
color: #222;
}

#contentArea-large .main-inner .title-area a span{
background: url(../images/img_arrow_02.png) no-repeat right 50%;
padding-right: 18px;
font-size: 18px;
}


@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#contentArea-large .main-inner .title-area a span{
background: url(../images/img_arrow_02@2x.png) no-repeat right 50%;
background-size: 8px 14px;
  }
}

/* -- ターミナルへのリンク -- */

.main .terminal-btn {
	height: 196px;
	width: 100%;
	position: absolute;
	bottom: 0;
	background: rgba(0,0,0,0.8);
	color: #fff;
	 }
	 
.main .terminal-btn-inner { 
	width: 980px;
	height: 196px;
	margin: 0 auto;
	background: url(../images/bg_anywhere_main_02.png) no-repeat 530px center;}	 
	 
	 
.main .terminal-btn-inner .text-area{
	width: 500px;
	padding: 30px 0 0 10px;
	text-align: center;} 
	 
.main .terminal-btn-inner .text-area p{
	margin: 0;
	letter-spacing: 1px;}	 
	
	
.main .terminal-btn-inner .text-area .catch {
	font-size: 20px;
	letter-spacing: 2.5px;
	font-weight: bold;
	margin-bottom: 10px;
	}	
	
.main .terminal-btn-inner a {
	display: inline-block;
	background:#F4A600;
	color: #fff;
	padding: 5px 53px 5px 83px;
	border-radius: 3px;
	letter-spacing: 2px;
	margin-top: 20px;
	font-weight: bold;}	
	
	
.main .terminal-btn-inner a:hover {
	text-decoration: none;
	opacity: 0.8;}
	
.main .terminal-btn-inner a span {
	background: url(../images/icon_arrow_white.png) no-repeat right 50%;
padding-right: 50px;
	}	
.main .terminal-btn-inner a span:hover {
	text-decoration: none;}	

	
/*--- 概要 ---*/	
	
.feature-wrap {
	width: 980px;
	margin: 0 auto;
	padding: 80px 0 40px;
	border-bottom: 1px solid #ccc;
	}

.feature-wrap h3 { font-size: 34px;
margin-bottom: 0.5em;
text-align: center;}	

.feature-wrap .sub-title {
	text-align: center;
	font-size: 16px;}	

.feature-wrap ul {
	margin: 40px auto 0;}

.feature-wrap ul li {
	display: block;
	width: 326px;
	float: left;
	text-align: center;
	margin-bottom: 50px;}
	
.feature-wrap ul li h4 {
	font-size: 17px;
	font-weight: bold;
	margin: 1.2em 0 1em;
}

.feature-wrap ul li .lead {
	text-align: left;
	padding: 0 40px;
}


.feature-wrap ul li h4 .merit{
	color: #fff;
	background: #F4A600;
	font-size: 10px;
	font-weight: normal;
	padding: 4px 8px;
	border-radius: 2px;
	margin-right: 1em; }
	
/* -- コンテンツが2個の場合 -- */

.feature-wrap ul.double {
	width: 652px;}	


/*--- テーブル ---*/

table.type-01 {
	border: 2px solid #bbb;
	text-align: left;
	background: #fff;
	width: 980px;
	margin: 10px auto;
	}
	
table.type-01 th,table.type-01 td{
	border: 1px solid #bbb;}

table.type-01 th {
	color: #fff;
	font-weight: bold;
	background: #666;
	text-align: center;}
	
	
table.type-02 {
	text-align: left;
	background: #fff;
	width: 980px;
	margin: 10px auto;
	}

table.type-02 tr{
	border-bottom: 1px solid #bbb;}
	
table.type-02 th,table.type-02 td{
	padding : 15px 30px;}

table.type-02 th {
}


table.type-03 {
	text-align: left;
	background: #fff;
	width: 980px;
	margin: 10px auto;
	border: 2px solid #bbb;
	}
	
table.type-03 th,table.type-03 td{
	padding : 15px 30px;
	border: 1px solid #bbb;}

table.type-03 th {
	vertical-align: middle
}	


/* --- リンクリスト --- */
	
.link-list ul {
	overflow: hidden;}

.link-list li { 
	float: left;
	margin-right: 28px;}
	
.list-down li {
	margin-bottom: 10px; 
	font-size: 15px;
}	
	
 .list-down li a {
	padding-right: 15px;
	background: url(../../common/images/icon_arrow_down.png) no-repeat right center;
}


/* --- ボーダー --- */	

.hr_dot hr {
	height: 0;
	margin: 0;
	overflow: hidden;
	border: none;}

.hr_dot {
	margin: 10px 0;
	border-bottom: dotted 1px #bbb;}
	
.hr_gray hr {
	height: 0;
	margin: 0;
	overflow: hidden;
	border: none;}

.hr_gray {
	margin: 10px 0;
	border-bottom: solid 1px #ccc;}	


/* --- アプリリンク --- */	

.app-area {
	/*border-bottom: 1px solid #ddd;*/}

.app-area ul{
	text-align: right;
	width: 980px;
	margin: 30px auto 40px;}

.app-area li{
	display: inline;
	margin: 0 0 0 12px;
	height: 48px;
	text-align: center;
	}

.app-area li img {
	height: 45px;}

.app-area li.win10 a{
	display: inline-block;
	background: #0A70C5;
	vertical-align: top;
	padding: 4px 18px;
	vertical-align: 1;
}

.app-area li.win10 span {
	color: #fff;
	font-size: 10px;
	display: block;}	
.app-area li.win10 .logo {
	font-size: 13px;
	letter-spacing: 0.6px;
	font-weight: bold;}
		
	
/* === 会社概要、採用情報 === */

#company table,#recruit table { 
width: 850px;
/*font-size: 15px;*/
text-align: left;
margin: 10px auto 70px;
}

#company table tr,#recruit table tr { 
border-bottom: 1px solid #ddd;}

#company table th,#recruit table th { width: 200px;
	padding: 18px 0 18px 60px; }

#company table td,#recruit table td {
	padding: 18px 10px; 	
	line-height: 1.8;
}

/* --- map --- */
#mapContent{}

#mapContent b { font-weight: bold!important;}



/* === ニュース === */
#news h2 {
	font-size: 23px;
	margin-bottom: 0;
	border-bottom: 1px solid #ddd;
	padding-bottom: 12px;}
	
#news .select-year {
	margin-bottom: 50px;}

#news .select-year span,.select-year form{
	display: inline-block ;}

#news .select-year span {}
#news .select-year form {
	width: auto;
	margin-left: -17px;}
	
#news .select-year form select {
	font-size: 14px;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border-radius: 0;
    margin: 0;
    padding: 0;
    background: none transparent;
    vertical-align: middle;
	border:  none;
    text-indent: .01px; /*Firefox用*/
    text-overflow: ""; /*Firefox用*/
	
/* プルダウンの矢印を消す */
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}/*firefox*/
#news select::-ms-expand {
  display: none;
}/*IE*/	
	
/* プルダウンの矢印 */	
#news .select-year form select {
	border: 1px solid #939393;
	padding: 0.3em 30px 0.3em 0.6em;
 	background: #fff url(../images/icon_arrow_select.png) right center no-repeat;
  	background-size: 24px auto;
    /*
  @include scale(0.9);
  @include transform-origin(left center);
  */
  text-indent: 0.01px;
  text-overflow: '';
  background: none\9;
  padding: 0 0 0 5px\9;
}

#newsTable {
	width: 980px;
text-align: left;
margin: 0 auto 70px;
}

#newsTable tr { 
border-bottom: 1px solid #ddd;}

#newsTable th { width: 100px;
	padding: 18px 0 ;}

#newsTable td {
	padding: 18px 0; 	
	line-height: 1.8;
}

#newsTable .type {
	width: 135px;}

#newsTable .info,#newsTable .release {
	font-size: 11px;
	color: #fff;
	margin-left: 10px;
	/*font-weight: bold*/;
	}
#newsTable .info { 
background: #D76407;
padding: 4px 29px;}	

#newsTable .release {
	background :#d8d8d8;
	color: #D76407;
padding: 4px 7px;}


#newsTable .topPDF{
	background: url(../../common/images/icon_pdf.png) no-repeat center left;
	padding-left: 15px;
	margin-left: 5px;
}


/* === プライバシーポリシー、利用規定、反社会的勢力排除に対する基本方針 === */

#terms,#privacy,#antisocial {
	margin-bottom: 100px;
	font-size: 105%;
	line-height: 1.8;
	}
	
#terms h1 { margin-bottom: 10px;}	

#terms h2 {
	font-size: 22px;
	margin-bottom: 30px;}

#terms .link-list {
	margin-bottom: 40px;
	font-size: 13px;}
		
#terms .link-list ul {
	float: right;}
	
#terms .link-list li:last-child {
	margin-right: 0}	
	
#terms .link-list li a {
	padding-right: 15px;
	background: url(../../common/images/icon_arrow_next.png) no-repeat right center;
	/*color: #222;*/
}
	
#terms h3,#privacy h3{
	margin-left: -23px;
	}	

#terms .h3Box,#privacy .h3Box {
	margin-left: 18px;
	margin-bottom: 20px;}
	
#terms ol,#privacy ol,#antisocial ol{
	margin: 0.8em 0}
	
#terms ol li,#privacy ol li,#antisocial ol li{
	list-style: decimal outside none;
	margin: 0 0 8px 2em; 
	 }	
#terms ol li p,#privacy ol li p,#antisocial  ol li p{
	text-indent: -1.8em;
	padding-left: 1.8em; }

#terms li ol li {
	list-style: none;
	text-indent: -1.5em;
	padding-left: 1.5em; }	
	
	
#terms table
 { border: 1px solid #ccc;
 width: 100%;}
#terms table th {
	background: #eee;} 	

#terms table th,#terms table td
 { border: 1px solid #ccc;
 padding: 10px;}


 #policy li ul{
	 margin: 0.8em 0;}	
 
 #policy li ul li{
	 list-style: none;
	 margin-left: 0.5em;}	


#agencyList dl {
	margin-top: 20px;
	margin-bottom: 80px;
	}

#agencyList dt {
	font-weight: bold;
	}

#agencyList dd {
	margin: 3px 0 15px 14px;
}


/* --- 対応OS --- */

.os { padding: 30px 0 60px;
	margin-bottom: 40px;}
.os h3 {
	font-size: 30px;
	width: 980px;
	margin: 1em auto;}
.os	table th,.os table td{
	padding: 13px 0px;
	text-align: center;
	vertical-align: middle;}	
/*.os table td { width: 12%;}*/
.os table th {
	/*width: 150px;*/
	font-size: 16px;
	font-weight: normal;}	
.os table .space {
	width: 150px; }	
.os table .top {
	background: #ddd;}

.os p {
	width: 980px;
	margin: 0 auto;
	}
.os .email { font-size: 10px;
	margin-left: 5px;
	margin-right: -15px;}