@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%;
	font-weight:normal;
	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-mid {
	width: 100%;
}


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





ul.toppgcmpy2023 { /* 自社名 */
	list-style:none;
	background-color:#E9E9E9;
	padding-top:1em;
	padding-bottom:1em;
	padding-left:0;
	margin:0;
}

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

	


/* 最終更新日 */
#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;
}



.clr-all-sp5 { 
	clear:both;
}

.clr-all-sp5 hr { /* データの区切り（上下に余白） */
	width:98%;
	border-width:0 0 1px 0;
	border-color:#FFF;
	border-style:solid;
	margin:5px 0 5px 0;
}

.clr-all-sp30 { 
	clear:both;
}

.clr-all-sp30 hr { /* データの区切り（上下に余白） */
	width:98%;
	border-width:0 0 1px 0;
	border-color:#FFF;
	border-style:solid;
	margin:30px 0 30px 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-oshirase { /* お知らせ */
	float:left; 
	font-size:150%;
	line-height:1.5;
	text-align:left;
	text-decoration:underline;
	font-weight:normal;
	font-style:italic;
	background-color:#FF0;
	color:#006;
	padding:0.15em 0.5em 0 0.5em;
}

@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */
	#contents .topics-oshirase {
		padding:0.12em 0.5em 0 0.5em;

	}
}

@media screen and (max-width : 767px){ /* ----スマホ */
	#contents .topics-oshirase {
		padding:0.12em 0.5em 0 0.5em;

	}
}




ul.title-1 {
	list-style:none;
	padding-left:0;
	margin:0;
}

ul.title-1 li {
	text-align:left;
	font-size:102%;
	line-height:1.5;
	border-bottom-width:1px;
	border-bottom-style:solid;
	border-bottom-color:#ECECEC;
}

.ymd { /* 日付 */
	font-style:italic;
	color:#2E5C5C;
	font-weight:bold;
}

.astarsk { /* 注釈 */
	font-size:85%;

}




@media screen and (min-width : 768px) and (max-width : 959px){ /* ----タブレット */
	ul.title-1 li {
		font-size:100%;
	}
}

@media screen and (max-width : 767px){ /* ----スマホ */
	ul.title-1 li {
		font-size:90%;
	}
}







/* ガソリンスタンド仕入・販売・在庫管理システム SSS for Windows */
#contents #ss-icon {
	display:inline;
}

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

}
	
#contents #ss-title {
	color:#003;
	font-size:110%;
	text-align:left;
	line-height:30px;
	margin-bottom:0;
}

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

	#contents #ss-title {
		font-size:130%;
		line-height:60px;
	}

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

}


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

	#contents #ss-title {
		font-size:150%;
		line-height:60px;
	}

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


/* タクシー業務管理システム　ハイウェー for Windows */
#contents #taxi-icon {
	display:inline;
}

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

}
	
#contents #taxi-title {
	color:#003;
	font-size:120%;
	text-align:left;
	line-height:30px;
	margin-bottom:0;
}


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

	#contents #taxi-title {
		font-size:140%;
		line-height:60px;
	}

}


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

	#contents #taxi-title {
		font-size:150%;
		line-height:60px;
	}

}





/* 満天土佐、イラスト＆写真、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-area .future-txt2 {
	text-align:left;
	font-size:96%;
	line-height:1.3;
	text-indent:1em;
}

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


#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;
}