@charset "utf-8";

/* ------------------------------------------------------------------------------------
 レイアウト
------------------------------------------------------------------------------------ */

/* pc sp 切り替え 表示・非表示 */
.desktop { display: block !important; }
.desktop-int { display: flex!important; }
.smartphone { display: none !important; }
 
@media only screen and (max-width: 767px) {
    .desktop { display: none !important; }
	.desktop-int { display: none!important; }
    .smartphone { display: block !important; }
}

/* ------------------------------------------------------------------- */
section {padding: 90px 0px 100px;}
.sectionmt60 {margin-top: 50px;}
@media only screen and (max-width: 767px) {
	section {padding: 60px 0px 30px;}
	.sectionmt60 {margin-top: 20px;}
}

/* ------------------------------------------------------------------- */

/* ３つの探す */
.sagasu-all {background: rgba(0,0,0,0.7); position: absolute; bottom: 120px; z-index: 8; width: 100%;}
@media only screen and (max-width:991px){.sagasu-all{bottom: 0;}}

.sagasu1150 {max-width: 1150px; margin: 0 auto;}
@media only screen and (max-width:1199px){.sagasu1150{max-width: 1000px; padding: 0 10px;}}
@media only screen and (max-width:991px){.sagasu1150{max-width: 880px; padding: 0 15px;}}

.sagasu-p20 {padding: 12px 0;}
@media only screen and (max-width:767px){.sagasu-p20 {padding: 0px 0px 10px 0;}}

#sagasu-station {margin-bottom: 0; width: 100%; padding-right: 5px;}
#sagasu-free {margin-bottom: 0; width: 100%; padding-left: 5px; padding-right: 5px;}
#sagasu-conditions {margin-bottom: 0; width: 100%; padding-left: 5px;}
#sagasu-conditions form select {
	border-style: none;
	font-size: 16px;
	top: 2px;
	left: 10px;
	position: absolute;
	width: 94%;
	height: 32px;
	color: #adadad;
	font-family: "Segoe UI", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
form select option {color: #121212;}
@media only screen and (max-width:991px){
	#sagasu-conditions form select {top: 6px; left: 8px; height: 24px; font-size: 14px;}
}
@media only screen and (max-width:767px){
	#sagasu-station {margin-bottom: 10px; padding-right: 0;}
	#sagasu-free {margin-bottom: 10px; padding: 0;}
	#sagasu-conditions {padding-left: 0;}
	#sagasu-conditions form select {width: 95%;}
}


/* ------------------------------------------------------------------- */

/* お知らせ */
#osirase {padding: 20px 0px; border-bottom: solid 1px #dddddd;}
#osirase .osirase-day {color: #9a0000; font-size: 16px; line-height: 1.6;}
#osirase .osirase-text {
	color: #333333;
	font-size: 16px;
	line-height: 1.6;
	text-overflow: ellipsis;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}
#osirase .osirase-itiran {font-size: 16px; line-height: 1.6;}
#osirase a {text-decoration: none; transition: all 0.5s ease 0s;}
#osirase a:hover {color: #999999; font-weight: 500;}
@media only screen and (max-width:1199px){
	#osirase .osirase-day {font-size: 14px; padding-left: 10px;}
	#osirase .osirase-text {font-size: 14px; padding-left: 15px;}
	#osirase .osirase-itiran {font-size: 14px; padding-right: 10px;}
}
@media only screen and (max-width:991px){
	#osirase .osirase-day {font-size: 14px; padding-left: 15px;}
	#osirase .osirase-text {font-size: 14px; padding-left: 30px;}
	#osirase .osirase-itiran {font-size: 14px; padding-right: 15px;}
}
@media only screen and (max-width:767px){
	#osirase .osirase-day {font-size: 14px; padding-left: 0px;}
	#osirase .osirase-text {font-size: 14px; padding-left: 0px;}
	#osirase .osirase-itiran {font-size: 14px; padding-right: 0px;}
}



/* ------------------------------------------------------------------- */

/* 一覧ボタン */
.but-ichiran {
	font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	display: inline-block;
	width: 200px;
	text-align: center;
	text-decoration: none;
	outline: none;
	position: relative;
	z-index: 2;
	background-color: #7e2b23;
/*	border: 2px solid #7e2b23;*/
	color: #ffffff;
	line-height: 50px;
	overflow: hidden;
}
/*--- 背景が降りてくる --- 
.but-ichiran::before, .but-ichiran::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.but-ichiran, .but-ichiran::before, .but-ichiran::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.but-ichiran:hover {
  color: #7e2b23;
	text-decoration: none;
}
.but-ichiran::after {
  top: -100%;
  width: 100%;
  height: 100%;
}
.but-ichiran:hover::after {
  top: 0;
  background-color: #ffffff;
}
--- */


.but-ichiran::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	content: "";
	background:
            linear-gradient(to right, #000000, #000000, rgba(0, 145, 255, 0)) 200% 0 / 200% 2px no-repeat,
            linear-gradient(to bottom, #000000, #000000, rgba(0, 145, 255, 0)) 100% 200% / 2px 200% no-repeat,
            linear-gradient(to left, #000000, #000000, rgba(0, 145, 255, 0)) -200% 100% / 200% 2px no-repeat,
            linear-gradient(to top, #000000, #000000, rgba(0, 145, 255, 0)) 0 -200% / 2px 200% no-repeat;
        transition:background-position 1.2s;
}
.but-ichiran:hover::before {background-position:0 0, 100% 0, 100% 100%, 0 100%;}
.but-ichiran:hover {text-decoration: none; color: #000000; background: rgba(255,255,255,0.8);}

@media only screen and (max-width:767px){.but-ichiran {line-height: 45px; font-size: 12px; padding: 0 15px;}}


/* ------------------------------------------------------------------- */
/* Search */
#sec-serch form select {
	border-style: none;
	font-size: 16px;
	top: 2px;
	left: 10px;
	position: absolute;
	width: 94%;
	height: 32px;
	color: #adadad;
	font-family: "Segoe UI", Verdana, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
@media only screen and (max-width:767px){
	#sec-serch form select {width: 100%; top: 0; left: 0;}
}




.osusume-tiiki a {color: #ffffff; display: block; position: relative;}
.osusume-img {
	width: 100%;
	height: auto;
	display: block;
    position: relative;
    overflow: hidden;
    z-index: 2;
}
.osusume-img img {width: 100%; height: auto; backface-visibility: hidden; transition: transform 0.75s ease;}

/* ------------------------------------------------------------------- */

/* マウスホバー拡大 */
.land-waku {display: block; width: 100%; overflow: hidden; position: relative;}
.land-waku a {display: block; text-decoration: none; width: 100%; height: 100%; transition-property: background-color, color; transition-duration: 0.2s; transition-timing-function: ease;}
.land-waku a .img-expansion {display: block; width: 100%; height: 100%; overflow: hidden; position: relative;}
.land-waku a .img-expansion img {display: block; width: 100%; height: 100%; object-fit: cover; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.5s ease; transition: all 0.5s ease;}
.land-waku a .img-expansion img.hover-land-line {position: absolute; top: 0; left: 0;}
.land-text {position: absolute; bottom: 0; left: 0; z-index: 9; width: 100%; text-align: center; overflow: hidden; -webkit-transition-property: color; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-roperty: color; transition-duration: 0.2s; transition-timing-function: ease;}
.land-text span {font-size: 28px; color: #ffffff; padding: 30px 30px 22px; font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.land-waku a:hover {display: block; width: 100%; height: 100%;}
.land-waku a:hover .img-expansion .hover-land-img {transform: scale(1.2, 1.2);}

.img-expansion {overflow: hidden; width: 100%; height: auto; display: flex; position: relative; z-index: 2; background: #ffffff; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-top: solid 1px #ddd;}
a .img-expansion img {width: 100%; height: auto; transition: transform 0.75s ease; backface-visibility: hidden;}
a .img-expansion img:hover {transform: scale(1.2, 1.2);}

.know-item a.img-expansion img {width: 100%; height: auto; transition: transform 0.75s ease; backface-visibility: hidden;}
.know-item a:hover .img-expansion img {transform: scale(1.2, 1.2);}
.know-item a:hover .title_area h4 {text-decoration: none; color: #999999;}

@media only screen and (max-width:1199px){.land-text span {font-size: 24px;}}
@media only screen and (max-width:991px){.land-text span {font-size: 20px; padding: 30px 10px 22px;}}
@media only screen and (max-width:600px){.land-text span {font-size: 18px;}}

/* ------------------------------------------------------------------- */

/* dictionary */
a.sample_button{
display:block;
width:100px;
margin:0 auto;
position:relative;
text-align: center;
cursor:pointer;
background-color:#eaeaea;
box-shadow: 0 0 0 0 rgba(0,0,0,0.4);
transition: all 0.3s;
}
a.sample_button::before{
position:absolute;
top:0;
left:0;
content:"";
display:block;
width:0px;
height:1px;
background-color:#9d9d9d;
transition: all 0.3s;
}
a.sample_button::after{
position:absolute;
bottom:0;
right:0;
content:"";
display:block;
width:0px;
height:1px;
background-color:#9d9d9d;
transition: all 0.3s;
}
a.sample_button span{
display:block;
width:100%;
height:100%;
padding:10px 20px;
transition: all 0.3s;
}
a.sample_button span::before{
position:absolute;
bottom:0;
left:0;
content:"";
display:block;
width:1px;
height:0px;
background-color:#9d9d9d;
transition: all 0.3s;
}
a.sample_button span::after{
position:absolute;
top:0;
right:0;
content:"";
display:block;
width:1px;
height:0px;
background-color:#9d9d9d;
transition: all 0.3s;
}
 
/*ここからhoverエフェクト*/
a.sample_button:hover{
box-shadow: 0 3px 5px 0 rgba(0,0,0,0.4);
background-color:#fff;
}
a.sample_button:hover::before{
width:100%;
}
a.sample_button:hover::after{
width:100%;
}
a.sample_button:hover span{
padding:10px 20px;
}
a.sample_button:hover span::before{
height:100%;
}
a.sample_button:hover span::after{
height:100%;
}

.dic-bg img {
	width: 75%;
}

a.dic-bg {display: block; text-decoration: none; width: 100%; height: 100%;}
a.dic-bg:hover {text-decoration: none;}
.img-exp-dic {display: block; width: 200px; height: 200px; overflow: hidden; position: relative;}
.img-exp-dic img {
	display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.img-exp-dic .hover-dic-on {display: none; position: absolute; top: 0; left: 0;}
.img-exp-dic .hover-dic-line {position: absolute; top: 0; left: 0;}
a.dic-bg:hover .img-exp-dic .hover-dic {transform: scale(1.2, 1.2);}
a.dic-bg:hover .img-exp-dic .hover-dic-on {display: block;}

@media only screen and (max-width:1199px){
	#dictionary .dic-area {padding-left: 15px;}
	.img-exp-dic {width: 180px; height: 180px;}
}
@media only screen and (max-width:991px){
	.img-exp-dic {width: 140px; height: 140px;}
}
@media only screen and (max-width:767px){
	.img-exp-dic {width: 100px; height: 100px;}
}
@media only screen and (max-width:600px){
	.img-exp-dic {width: 50px; height: 50px;}
}



/* ------------------------------------------------------------------- */

/* introduction */
section#introduction {padding: 90px 0px 50px;}
@media only screen and (max-width: 767px) {section#introduction {padding: 60px 0px 20px;}}

/* ------------------------------------------------------------------- */

/* 差し色 */


/* ------------------------------------------------------------------- */

/* 配置 */
.tcenter {text-align: center;}
.tright {text-align: right;}
.tleft {text-align: left;}



/* ------------------------------------------------------------------- */

/* bootstrap */
.row-ar {display: flex; flex-wrap: wrap;}
.col-12 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.col-10 {-ms-flex: 0 0 83.333334%; flex: 0 0 83.333334%; max-width: 83.333334%;}
.col-9-osi {-ms-flex: 0 0 70%; flex: 0 0 70%; max-width: 70%;}
.col-9-int {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-9 {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
.col-8-header {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
.col-8 {-ms-flex: 0 0 66.666667%; flex: 0 0 66.666667%; max-width: 66.666667%;}
.col-7 {-ms-flex: 0 0 58.333333%; flex: 0 0 58.333333%; max-width: 58.333333%;}
.col-6-footer {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-6-int {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-6-news {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-6 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
.col-5 {-ms-flex: 0 0 41.666667%; flex: 0 0 41.666667%; max-width: 41.666667%;}
.col-4-header {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-4 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
.col-3-int {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-3-search {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-3-header {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-3 {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.col-24-footer {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-24 {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
.col-2-osi {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; text-align: right;}
.col-2 {-ms-flex: 0 0 16.666667%; flex: 0 0 16.666667%; max-width: 16.666667%;}
.col-1-header {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}
.col-foot-1 {-ms-flex: 0 0 14.277777%; flex: 0 0 14.277777%; max-width: 14.277777%;}
.col-1-osi {-ms-flex: 0 0 10%; flex: 0 0 10%; max-width: 10%;}
.col-1 {-ms-flex: 0 0 8.333333%; flex: 0 0 8.333333%; max-width: 8.333333%;}

.header-col-3 {-ms-flex: 0 0 22%; flex: 0 0 22%; max-width: 22%; height: 72px;}
.header-col-75 {-ms-flex: 0 0 65.5%; flex: 0 0 65.5%; max-width: 65.5%; height: 72px;}
.header-col-15 {-ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; height: 72px; text-align: right; padding: 18px 0;}

@media only screen and (max-width:1230px){
	.header-col-3 {height: 70px;}
	.header-col-75 {height: 70px;}
	.header-col-15 {height: 70px;}
}

@media only screen and (max-width:1199px){
	.header-col-3 {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
	.header-col-75 {-ms-flex: 0 0 67.5%; flex: 0 0 67.5%; max-width: 67.5%;}
	.header-col-15 {-ms-flex: 0 0 12.5%; flex: 0 0 12.5%; max-width: 12.5%; padding: 20px 0;}
}

@media only screen and (max-width:991px){
	.col-2 {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
	.header-col-3 {-ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%;}
	.header-col-75 {-ms-flex: 0 0 65%; flex: 0 0 65%; max-width: 65%;}
	.header-col-15 {-ms-flex: 0 0 15%; flex: 0 0 15%; max-width: 15%; padding: 24px 0;}
}

@media only screen and (max-width:767px){
	.col-8-header {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-8 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-6-int {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-6-news {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-4 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-4-block {-ms-flex: 0 0 16.666666%; flex: 0 0 16.666666%; max-width: 16.666666%;}
	.col-3-header {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
	.col-3-search {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
	.col-3 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
	.col-1-header {-ms-flex: 0 0 12%; flex: 0 0 12%; max-width: 12%;}
	
	.col-9-osi {-ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;}
	.col-2-osi {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
	.col-1-osi {-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
	
	.header-col-3 {-ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; height: 60px;}
	.header-col-75 {-ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%; height: 60px;}
	.header-col-15 {-ms-flex: 0 0 30%; flex: 0 0 30%; max-width: 30%; height: 60px;}
	
	#header {height: 60px!important;}
	#global_menu {top: 60px!important;}
	a.menu_button {width: 60px!important; height: 60px!important; line-height: 60px!important;}
}

@media only screen and (max-width:600px){
	.col-3-search {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
	.header-col-3 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; height: 60px;}
}
	
@media only screen and (max-width:429px){
	.col-4-block {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width: 33.333333%;}
/*	.col-3 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}*/
	.col-6 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
}


/* ------------------------------------------------------------------- */

/* その他 */
.fw-bold {font-weight: bold;}

.red { color: #fe0000; }
.green { color: #009933; }
.orange { color: #ff7e00; }

.mt1  { margin-top:1px;  }
.mt3  { margin-top:3px;  }
.mt5  { margin-top:5px;  }
.mt8  { margin-top:8px;  }
.mt10 { margin-top:10px; }
.mt15 { margin-top:15px; }
.mt20 {	margin-top:20px!important; }
.mt25 { margin-top:25px; }
.mt30 { margin-top:30px; }
.mt35 { margin-top:35px; }
.mt40 { margin-top:40px; }
.mt45 { margin-top:45px; }
.mt50 { margin-top:50px; }
.mt390 { margin-top:390px; }

.mb5  { margin-bottom:5px;  }
.mb6  { margin-bottom:6px;  }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb25 { margin-bottom:25px; }
.mb30 { margin-bottom:30px; }
.mb35 { margin-bottom:35px; }
.mb40 { margin-bottom:40px; }
.mb45 { margin-bottom:45px; }
.mb50 { margin-bottom:50px; }
.mb60 { margin-bottom:60px; }

.ml5  { margin-left:5px;  }
.ml7  { margin-left:7px;  }
.ml10 { margin-left:10px; }
.ml15 { margin-left:15px; }
.ml20 { margin-left:20px; }
.ml25 { margin-left:25px; }
.ml30 { margin-left:30px; }
.ml35 { margin-left:35px; }
.ml40 { margin-left:40px; }
.ml45 { margin-left:45px; }
.ml50 { margin-left:50px; }

.mr5  { margin-right:5px;  }
.mr10 { margin-right:10px; }
.mr15 { margin-right:15px; }
.mr20 { margin-right:20px; }
.mr25 { margin-right:25px; }
.mr30 { margin-right:30px; }
.mr35 { margin-right:35px; }
.mr40 { margin-right:40px; }
.mr45 { margin-right:45px; }
.mr50 { margin-right:50px; }
.mr60 { margin-right:60px; }
.mr90 { margin-right:90px; }
.mr180 { margin-right:180px; }

.pt5  { padding-top:5px;  }
.pt8  { padding-top:8px;  }
.pt10 { padding-top:10px; }
.pt14 { padding-top:14px; }
.pt15 { padding-top:15px; }
.pt20 { padding-top:20px; }
.pt25 { padding-top:25px; }
.pt30 { padding-top:30px; }
.pt35 { padding-top:35px; }
.pt40 { padding-top:40px; }
.pt45 { padding-top:45px; }
.pt50 { padding-top:50px; }
.pt70 { padding-top:70px; }

.pb5  { padding-bottom:5px;  }
.pb6  { padding-bottom:6px;  }
.pb10 { padding-bottom:10px; }
.pb15 { padding-bottom:15px; }
.pb20 { padding-bottom:20px; }
.pb25 { padding-bottom:25px; }
.pb30 { padding-bottom:30px; }
.pb35 { padding-bottom:35px; }
.pb40 { padding-bottom:40px; }
.pb45 { padding-bottom:45px; }
.pb50 { padding-bottom:50px; }

.pl5  { padding-left:5px;  }
.pl10 { padding-left:10px; }
.pl15 { padding-left:15px; }
.pl20 { padding-left:20px; }
.pl25 { padding-left:25px; }
.pl30 { padding-left:30px; }
.pl35 { padding-left:35px; }
.pl40 { padding-left:40px; }
.pl45 { padding-left:45px; }
.pl50 { padding-left:50px; }
.pl60 { padding-left:60px; }
.pl70 { padding-left:70px; }
.pl300 { padding-left:300px; }

.pr5  { padding-right:5px;  }
.pr10 { padding-right:10px; }
.pr15 { padding-right:15px; }
.pr20 { padding-right:20px; }
.pr25 { padding-right:25px; }
.pr30 { padding-right:30px; }
.pr35 { padding-right:35px; }
.pr40 { padding-right:40px; }
.pr45 { padding-right:45px; }
.pr50 { padding-right:50px; }

.w50 { width:50px; }
.w60 { width:60px; }
.w70 { width:70px; }
.w80 { width:80px; }
.w90 { width:90px; }
.w100 { width:100px; }
.w110 { width:110px; }
.w120 { width:120px; }
.w130 { width:130px; }
.w140 { width:140px; }
.w150 { width:150px; }
.w160 { width:160px; }
.w170 { width:170px; }
.w180 { width:180px; }
.w190 { width:190px; }
.w200 { width:200px; }
.w210 { width:210px; }
.w220 { width:220px; }
.w230 { width:230px; }
.w240 { width:240px; }
.w250 { width:250px; }
.w260 { width:260px; }
.w270 { width:270px; }
.w280 { width:280px; }
.w290 { width:290px; }
.w300 { width:300px; }
.w310 { width:310px; }
.w320 { width:320px; }
.w330 { width:330px; }
.w340 { width:340px; }
.w350 { width:350px; }
.w360 { width:360px; }
.w370 { width:370px; }
.w380 { width:380px; }
.w390 { width:390px; }
.w400 { width:400px; }
.w410 { width:410px; }
.w420 { width:420px; }
.w430 { width:430px; }
.w440 { width:440px; }
.w450 { width:450px; }
.w460 { width:460px; }
.w470 { width:470px; }
.w480 { width:480px; }
.w490 { width:490px; }
.w500 { width:500px; }
.w510 { width:510px; }
.w520 { width:520px; }
.w530 { width:530px; }
.w540 { width:540px; }
.w550 { width:550px; }
.w560 { width:560px; }
.w570 { width:570px; }
.w580 { width:580px; }
.w590 { width:590px; }
.w600 { width:600px; }

.line-d {
	border-top-width: 1px;
	border-top-style: dashed;
	border-top-color: #CCC;
	margin-top: 20px;
	margin-bottom: 20px;
}

.cyuou {
	float: left;
	text-align: left;
	width: auto;
	vertical-align: middle;
}
.wcenter {
	margin-right: auto;
	margin-left: auto;
	width: auto;
}
.wcenter {
	margin-right: auto;
	margin-left: auto;
	width: 645px;
}

.font12 { font-size: 12px; }
.f8 { font-size: 8px; }
.f9 { font-size: 9px; }
.f10 { font-size: 10px; }
.f11 { font-size: 11px; }
.f12 { font-size: 12px; }
.f14 { font-size: 14px; }
.f16 { font-size: 16px; }
.f18 { font-size: 18px; }
.f20 { font-size: 20px; }
.f24 { font-size: 24px; }
.f36 { font-size: 36px; }

.fleft  { float:left;  }
.fright { float:right; }

.aclear { clear:both;  }
.lclear { clear:left;  }
.rclear { clear:right; }
.on a:hover img {opacity: 1.0;}

.fw-p16 {font-size: 16px; font-weight: bold; margin: 0px;}

/* ------------------------------------------------------------------- */