@charset "utf-8";
.pc { display: block; }
.sp { display: none; }
header	{font-family: Yu Gothic !important;}
footer	{font-family: Yu Gothic !important;}

#content	{border:none;font-family: メイリオ !important;}
#spheader	{ display:none; }
.pathWrap					{ margin-bottom: 10px; padding: 5px 0px 7px; }
.topicPath					{  }
.topicPath ol				{ float: left; width: 550px; padding: 5px 0 0 5px;  color: #666; }
.topicPath ol li			{ float: left; padding-left: 10px; font-size: 12px !important;}
.topicPath ol li a			{ display: block; padding: 0 13px 0 7px; background: url("/images/i_path.gif") no-repeat right center;font-size: 12px !important; }


.mat80	{margin-top:80px;}
.mat10	{margin-top:10px;}
.w50	{ width:50% !important; }
.bb_d	{border-bottom:dotted 1px #d3d3d3;}
.br_d	{border-right:dotted 1px #d3d3d3;}
.fs14	{font-size:14px;}
.tacl	{text-align:center;}
 
.fn	{font-size:24px;}
#list {background: url(../img/b_arrow_p_s.gif) no-repeat;padding-left: 10px;}

.n_h	{height:240px !important;}
.n_h2	{height:220px !important;}
.n_h3	{height:200px !important;}
.n_ta	{text-align:right;}

.main_mv img	{width:750px;}
.icon 	{
font-weight:700;
color:#6f6f6f;
font-size:16px !important;
margin:10px;
}
.icon img	{width:25px;}
.img_main	{padding:15px 5px;width:100px;}
.title 	{
margin:20px 10px 10px;
}
.title a	{
font-size:20px !important;
line-height:24px;
font-weight:700 !important;}
.coment	{margin:10px;font-size:14px !important;}

.m_title	{
font-weight:700 !important;
font-size:18px !important;
width:20% !important;
padding-right:10px;
padding-top:20px;
min-width:220px;
}

.m_title span	{
font-weight:500 !important;
font-size:16px !important;
width:auto;
}
.m_text	{
font-size:14px !important;
width:80%;
padding:20px 0;}

.side_head	{background:#770101;color:#ffffff;padding:10px;font-size:16px;font-weight:700;text-align:center;}


@media only screen and (max-width:480px) and (orientation:portrait), only screen and (min-width:361px) and (max-width:767px) and (orientation:landscape) {
	/*---------------------------------------------
	special
	---------------------------------------------*/
	body { min-width:100%; }
	
	.column2 { float:none; margin:0; width:auto; }
	.column2 #side { display:none; }
	.column2 #main { position:static; margin:0; }
	.column2 #content { border:none; }

	.pc { display:none; }
	.sp { display:block; font-size:14px; line-height:1.5; }
.mat80	{margin-top:50px;}
.p10	{padding:0 10px;}
.mals10	{margin-left:10px;}

.pathWrap					{ margin-bottom: 10px; padding: 5px 0px 7px; }
.topicPath ol				{ float: left; width: 100%; padding: 5px 0 0 5px;  color: #666; }
	
	.fn	{font-size:18px;}
	.fn	{font-size:24px;}
	.n_ta	{text-align:center;}
	#list {background: url(../img/b_arrow_p_s.gif) no-repeat;padding-left: 10px;}

	
	.w50	{ width:100% !important; }
	.br_d	{border-right:0px;}
	
	.clearfix:after,

	.scroll ul:after	{ content:" "; clear:both; display:block; height:0; }

.main_mv img	{width:100%;}

}

/*== ボタン共通設定 */
.btn{
    /*アニメーションの起点とするためrelativeを指定*/
    position: relative;
  overflow: hidden;
    /*ボタンの形状*/
  text-decoration: none;
  display: inline-block;
    border: 2px solid #b99bee;/* ボーダーの色と太さ */
    padding: 10px 30px;
    text-align: center;
    outline: none;
    color:#b99bee;
    /*アニメーションの指定*/   
    transition: ease .2s;
    
}


.btn_active{
    /*アニメーションの起点とするためrelativeを指定*/
    position: relative;
  overflow: hidden;
    border: 2px solid #b99bee;/* ボーダーの色と太さ */
    padding: 10px 30px !important;
    text-align: center;
    outline: none;
    color:#ffffff !important;
    background:#b99bee;
    margin-right:10px;
}
    
.btn_active span{
  font-weight:700;
}

/*ボタン内spanの形状*/
.btn span {
  position: relative;
  z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
  color:#b99bee;
  font-weight:700;

}

.btn:hover span{
  color:#fff;
  font-weight:700;
}

/*== 背景が流れる（左から右） */
.bgleft:before {
  content: '';
    /*絶対配置で位置を指定*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
    /*色や形状*/
  background:#b99bee;/*背景色*/
  width: 100%;
  height: 100%;
    /*アニメーション*/
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: right top;
}

/*hoverした際の形状*/
.bgleft:hover:before{
  transform-origin:left top;
  transform:scale(1, 1);
}


.btn_top { margin:20px auto 20px;max-width:1100px;}
.btn_top li{
display: inline-block;
padding:0 15px;
color:#000000;
font-weight:700;
font-size:20px !important;

}


.btn_top a,
.btn_top a:hover {
    color: #000 !important;
    text-decoration: none;
}


@media (max-width: 768px) {


/*== ボタン共通設定 */
.btn{
    padding: 5px 7px;
    
}


.btn_active{
    /*アニメーションの起点とするためrelativeを指定*/
    padding: 5px 10px !important;
    margin-right:5px;
    
}

/*ボタン内spanの形状*/
.btn span {
  position: relative;
  z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
  color:#b99bee;
}

.btn:hover span{
  color:#fff;
}

/*== 背景が流れる（左から右） */
.bgleft:before {
  content: '';
    /*絶対配置で位置を指定*/
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
    /*色や形状*/
  background:#b99bee;/*背景色*/
  width: 100%;
  height: 100%;
    /*アニメーション*/
  transition: transform .6s cubic-bezier(0.8, 0, 0.2, 1) 0s;
  transform: scale(0, 1);
  transform-origin: right top;
}


.btn_top { margin:10px 0;max-width:100%;
}
.btn_top li{
padding:0 3px;
font-size:14px !important;
line-height:24px; 
}

.tacl	{text-align:left;}

.icon 	{
font-size:15px !important;
margin:10px;
}

.title a	{
font-size:18px !important;
line-height:20px;
}

.m_title	{
font-size:15px !important;
width:35%;
padding-right:10px;
padding-top:10px;
min-width:130px;
}
.m_title span	{
font-size:13px !important;
}
.m_text	{
font-size:14px !important;
width:65%;
padding:10px 0;}



}

.l-footer__netoff a	{
color:#333 !important;

}
.c-button--main {
    color: #fff !important;
    background-color: #6fba2c;
    }

.c-button--outline {
    color: #6fba2c !important;
}    
 


.l-header__nav-list a {
color:#333 !important;
font-size: 14px !important;
font-weight:500 !important;
}

.l-header__nav-list--red button {
font-size: 14px !important;
font-weight:500 !important;
}
    
.l-header__nav-list a:hover {
text-decoration:none;
}
.l-header__nav-title {
font-size: 14px !important;
font-weight:500 !important;
text-align:left;
}
