@charset "utf-8";

/*==========================================
 レイアウト
===========================================*/

/* ページ */
div.page {
	width          : 100%;
	margin         : 0 auto;
}

/* ヘッダー */
header#header-bar {
	width          : 100%;
}

/* コンテナ */
#container {
	width          : 100%;
	padding-top    : 45px;
}

#targetMain {
	width          : 100%;
	margin         : 0 auto;
}

/* フッターバー */
footer#mosaFooter-bar {
	width          : 100%;
}

/* フッター */
footer#mosaFooter {
	width          : 100%; /*これを指定してはいけない */
}

@media all and (min-width:640px) and (max-width:959px) {

}

@media all and (min-width:960px) {
}
@media all and (max-width:1023px){
	div.page,
	header#header-bar,
	#container,
	footer#mosaFooter-bar,
	footer#mosaFooter {
		width      : 100%;
	}

}
@media all and (min-width:1024px) {
}
@media all and (min-width:1366px){
	div.page,
	header#header-bar,
	#container,
	footer#mosaFooter-bar,
	footer#mosaFooter {
		width      : 1366px;
	}

}

/*==========================================
 コンテナのスタイル
===========================================*/

/*menu*/
#col1 {
  float            : left;
  width            : 0px;
  padding          : 0px 0px 0px 0px;
  background-repeat: repeat;
}
#col2 {
  width            : auto;
  margin           : 0 0 0 5px;
  position         : relative;
  float            : left;
}
#col3 {
  width            : 100%;
  margin           : 0px 0px 0px 0px;
  position         : relative;
  float            : left;
  overflow-x       : hidden;
  overflow-y       : hidden;
}
#col4 {
	width          : auto;
}
#col1_content {
	position       : relative;
	padding        : 0px 0px 20px 0px;
	font-size      : 8pt;
}
#col3_content {
	position       : relative;
	padding        : 0px 0px 20px 0px;
	min-height     : 1000px;
}
#col2_content {
	position       : relative;
	padding        : 0px 0px 20px 0px;
	font-size      : 8pt;
}

@media all and (mix-width:415px) {
	#col3 {
		margin     : 0px 10px 0px 10px;
	}
	#col3_content {
		padding    : 10px 10px 20px 10px;
	}
}

@media all and (min-width:640px){

}
@media all and (min-width:768px){

}

@media all and (max-width:1024px){
	#col1 {
	    display    : none;
		width      : 0px;
		padding    : 0px 0px;
	}
	#col2 {
	    display    : none;
		width      : 0px;
		padding    : 0px 0px;
	}
}

@media all and (min-width:1025px){
	#col1 {
	    display    : block;
		width      : 250px;
		padding    : 5px 5px 5px 5px;
	}
	#col2 {
	    display    : block;
		width      : 250px;
		padding    : 5px 5px 5px 5px;
	}
	#col3 {
		width      : calc( 100% - 500px - 30px);
	}
}

/*==========================================
 フッターのスタイル
===========================================*/
#siteFooter {
	width                  : 100%;
    border-top             : 5px solid #000;
    padding-top            : 10px;
    padding-bottom         : 100px;
    color                  : #fff;
}

#siteFooter-site-name {
    text-align: center;
    font-size: 16px;
}

#siteFooter-site-copylight {
	margin: 10px;
    text-align: center;
    font-size: 12px;
}

#site-producer {
	text-align: center;
}

#site-producer #footer-info-company {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 0 12px;
}

#site-producer .footer-info-menu {
	float: none;
	display: inline-block;
	margin: 20px 6px;
	text-align: center;
}

#site-producer #footer-info-logo {
	display: flex;
	justify-content: center;
}

#site-producer #footer-info-logo-tripbright {
	margin: 30px auto 20px auto;
	text-align: center;
}

#footer-info-support,
#footer-info-company,
#footer-info-copyright {
	clear           : both;
}

.footer-info-category {
	color           : #cdbe75;
	font-size       : 12px;
	font-weight     : bold;
	margin          : 6px;
	float           : left;
}

.footer-info-menu {
	float           : left;
	font-size       : 12px;
	margin          : 20px 6px;
    cursor          : pointer;
}

#footer-info-logo {
	clear           : both;
}

#footer-info-logo-mosa1 {
	margin          : 6px;
	float           : left;
	font-size       : 12px;
}

#footer-info-logo-mosa2 {
    font-size       : 14px;
    font-family     : "Coiny",cursive;
    color           : #00acc3;
	padding-top     : 6px;
}

#footer-info-logo-tripbright {
    width           : 136px;
    margin          : 30px 0 20px 10px;
    font-size       : 12px;
    text-align      : left;
}

#footer-info-logo-tripbright img {
	width           : 100%;
}

#footer-info-copyright {
	font-size       : 12px;
	margin          : 6px;
    text-align      : left;
}

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

}

@media screen  and (min-width:1200px){
}

/*==========================================
 コンテンツエリア全体のスタイル
===========================================*/

#contents {
	width          : 100%;
	padding-bottom : 30px;
}

@media all and (min-width:768px){
	#contents {
		padding-left : 10px;
		padding-right: 10px;
	}
}

/*==========================================
 操作抑止のカバー
===========================================*/

.col1_content_cover,
.col2_content_cover {
	position      : absolute;
	width         : 100%;
	height        : 100%;
	display       : none;
	z-index       : 1000;
}