@charset "shift_jis";
/* レスポンシブ・デザイン対応ＣＳＳ     2017/02〜    */
/* （株）ユーキソフト・トップページ */



/* ****************** メイン・コンテンツの設定  */

#contents {
	width:100%;
	margin:0 auto;
	text-align:center;     /* マージンにautoを指定する方法が有効にならないブラウザ（IE6など）対策 */
}


#contents img {
	margin-bottom:1px;
	/* box-shadow: 0 0 0.3125em #2f1f1f; /* 0.3125em=5px */
}

#contents .ysicn {
	display:inline;
	margin:0 0.3em;
}


/* キャッチコピー */
#catch-copy h2 {
	display:inline;
	float:left;
	line-height:1.3;
	font-size:100%;
	font-weight:normal;
	margin-top:2px;
	margin-bottom:0;
	margin-left:1em;
}

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

	#catch-copy h2 {
		font-size:80%;
	}
	
}



/* サイト内検索 */
#site-srh {
	width:300px;
	display:inline;
	float:right;
	margin-bottom:2px;
}


/* ＴＯＰイメージ */
#topimage-home{
	clear:both;
	position:relative;
	width: 100%;
}

#topimage-home h1 {
	position:absolute;
	top:3%;
	left:1%;
	font-size:160%;
	color:#036;
}

#topimage-home .hjno {
	position:absolute;
	top:25%;
	left:2%;
	font-size:90%;
	color:#036;
}

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

	#topimage-home h1 {
		font-size:100%;
	}

	#topimage-home .hjno {
		font-size:75%;
		top:42%;
	}
	
}


@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */

	#topimage-home h1 {
		font-size:130%;
	}

	#topimage-home .hjno {
		font-size:85%;
		top:30%;
	}
	
}

/* 画像（下）ビーチ */
#topimage-under {
	width: 100%;
}

/* 画像（中）ビーチ */
#topimage-mid {
	width: 100%;
}

/* 画像（下）ビーチ */
#topimage-under {
	width: 100%;
}

/* 終わり:ＴＯＰイメージ */



	


/* 最終更新日 */
#final-date {
	display:inline;
	font-size:85%;
	margin-bottom:3px;
	margin-left:5px;
}



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

	/* サイト内検索 */
	#site-srh {
		float:left;
	}

	/* 補助アイコン */
	#sub-icon img {
		display:none;
	}
	
	/* 最終更新日 */
	#final-date {
		font-size:90%;
	}
	
}

@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */

	/* 補助アイコン */
	#sub-icon img {
		display:none;
	}
}




.clr-all { 
	clear:both;
}

.clr-all hr { /* コンテンツ内各データの区切り処理 */
	width:98%;
	border-width:0 0 1px 0;
	border-color:#FFF;
	border-style:solid;
	margin:3px 0 3px 0;
}





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

	#contents .main-left {
		width:100%;
		text-align:left;
	}
	
	#contents .main-right {
		width:100%;
		text-align:left;
	}
	

	.clr-all { /* コンテンツ内各データの区切り処理 */
		clear:both;
		
	}
	
	.clr-all hr {
		border-width:0 0 1px 0;
		border-color:#FFF;
		border-style:solid;
	}
	
	
}



@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */

	#contents {
		width:768px;
	}
	
	#contents #wrap-main {
		float:left;
		width:100%;
	}
	
	
	#contents .main-left {
		float:left;
		text-align:left;
		margin:0 auto;
		width:50%;
	}
	
	#contents .main-right {
		float:left;
		text-align:left;
		margin:0 auto;
		width:50%;
	}
	
}


/* ---------------------------------------------------パソコン */


@media print,screen and (min-width : 960px){

	#contents {
		width:960px;
	}
	
	#contents #wrap-main {
		float:left;
		width:83.334%; /* 800/960=83.334% */
		margin-right:-160px;
	}
	
	
	#contents .main-left {
		float:left;
		text-align:left;
		margin:0 auto;
		width:50%;
	}
	
	#contents .main-right {
		float:left;
		text-align:left;
		margin:0 auto;
		width:50%;
	}
	

}


/* 最新トピックス */
#contents #topics-area {
	width:99%;
	background-color:#FFF;
	margin-top:1em;
}


#contents #topics-ttl { /* タイトル */
	background-color:#069;
	font-size:110%;
	line-height:1.8;
	color:#FFF;
	text-align:left;
	padding-left:1em;
	margin-bottom:1em;
}

#contents #topics-ttl img {
	margin-right:3px;
	margin-top:4px;
	box-shadow:none;
}

#contents .tpdt hr {/* 区切りライン*/
	width:90%;
	border-width:0 0 2px 0;
	border-color:#036;
	border-style:dotted;
	margin-left:1em;
	margin-top:1px;
	margin-bottom:1px;
}

#contents .topics-data {/* お知らせ・新着情報データ */
	width 90%;
	font-size:96%;
	line-height:1.3;
	color:#003;
	text-align:left;
	margin-left:1em;
	margin-bottom:1em;
}

#contents .topics-data img {
	float:left;
	margin-right:3px;
	margin-top:4px;
	box-shadow:none;
}

#contents .topics-ymd { /* 日付 */
	font-size:90%;
	line-height:1.5;
	text-align:left;
}



/* ガソリンスタンド仕入・販売・在庫管理システム SSS for Windows */
#contents #ss-area {
	width:99%;
	background-color:#FFF;
	margin-top:1em;
	margin-left:3px;
	padding-left:0.5em;
	border-width:0 0 0 1px;
	border-color:#06F;
	border-style:dotted;
}

#contents #ss-icon {
	display:inline;
}

#contents #ss-icon img {
	float:left;
	margin-right:0;

}
	
#contents #ss-ctrl {
	display:inline-block;
	margin-top:0.2em;
}

#contents #ss-title {
	color:#003;
	font-size:80%;
	text-align:left;
}

@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */

	#contents #ss-title {
		font-size:95%;
	}

	#contents #ss-icon img {
		margin-right:0.5em;
	
	}

}


@media print,screen and (min-width : 960px){ /* ---パソコン */

	#contents #ss-title {
		font-size:110%;
	}

	#contents #ss-icon img {
		margin-right:0.5em;
	
	}
	
}


#contents #ss-logo {
	color:#003;
	font-size:180%;
	text-align:left;
	line-height:1.1;
}


#contents .yscomtext {
	clear:both;
	font-size:98%;
	text-indent:1em;
	line-height:1.2;
	padding:3px;
}


#contents #ss-area #ss-product {
	text-align:left;
	font-size:85%;
	text-indent:1em;
	margin-bottom:2em;
	
}

#contents #ss-area #ss-product img {
	float:right;
}
	
#contents #ss-area ul#ss-target {
   margin:0;
   padding:0 0 1em 0;
   font-size:90%;
   line-height:1.2;
}


/* タクシー業務管理システム　ハイウェー for Windows */
#contents #taxi-area {
	width:99%;
	background-color:#FFF;
	margin-top:1em;
	padding-left:0.5em;
	border-width:0 0 0 1px;
	border-color:#06F;
	border-style:dotted;
}

#contents #taxi-icon {
	display:inline;
}

#contents #taxi-icon img {
	float:left;
	margin-right:0.5em;

}
	
#contents #taxi-ctrl {
	display:inline-block;
	margin-top:0;
}

#contents #taxi-title {
	color:#003;
	font-size:120%;
	text-align:left;
}

#contents #taxi-logo {
	color:#003;
	font-size:140%;
	text-align:left;
	line-height:1.1;
}

@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */

	#contents #taxi-title {
		font-size:140%;
	}

	#contents #taxi-logo {
		font-size:140%;
	}

}


@media print,screen and (min-width : 960px){ /* ---パソコン */

	#contents #taxi-title {
		font-size:150%;
	}

	#contents #taxi-logo {
		font-size:150%;
	}

}



#contents #taxi-area #taxi-product {
	text-align:left;
	font-size:85%;
	text-indent:1em;
	margin-right:1em;
	margin-bottom:2em;
	
}

#contents #taxi-area #taxi-product img {
	float:left;
	margin-right:1em;
}
	
#contents #taxi-area ul#taxi-target {
   margin:0;
   padding:0 0 1em 0;
   font-size:90%;
   line-height:1.2;
}


/* 満天土佐、イラスト＆写真、iPhoneアプリ、LINEスタンプ、 */
#contents #future-area {
	width:99%;
	background-color:#FFF;
	margin-top:1em;
	margin-left:3px;
	padding-left:0.5em;
	border-width:0 0 0 1px;
	border-color:#06F;
	border-style:dotted;
}


#contents #future-area .future-title {
	font-size:120%;
	text-align:left;
}

#contents #future-area .future-txt {
	text-align:left;
	font-size:90%;
	line-height:1.2;
	text-indent:1em;
}

#contents .future-txt img {
	float:right;
	margin-right:0;

}

#contents #future-sp {
	width:99%;
	background-color:#FFF;
	margin:0 0 3em 0;
	padding:0;
}

#contents #future-sp img {
	float:left;
	margin-right:1em;
}


#contents .err-ttl h1 {
	background-color:#066;
	color:#FFF;
	text-align:left;
	font-size:130%;
	font-weight:normal;
	line-height:1.8;
	margin:0.2em 0 0.2em 0;
	padding-left:1em;
}


#contents ul.err-msg {
	margin:0 0 0 -2.5em;
}

#contents ul.err-msg li {
	text-align:left;
	font-size:100%;
	line-height:1.3;
	border-bottom-width:1px;
	border-bottom-style:dotted;
	border-bottom-color:#666;
}


ul.toppgcmpy { /* 自社名 */
	list-style:none;
	padding-left:0;
	margin:0;
}

ul.toppgcmpy li {
	text-align:left;
	font-size:95%;
	line-height:1.3;
	text-indent:1em;
}