@charset "utf-8";
*{ margin:0px; padding:0px; line-height:100%; outline:none; box-sizing:border-box;}
img{ border:0px; margin:0px; padding:0px; vertical-align: bottom;}
a{ text-decoration:none; outline:none; margin:0px; padding:0px;}
a:hover{ filter: alpha(opacity=0); -ms-filter: alpha(opacity=0); opacity: 0.8; -webkit-transition: all .3s; transition: all .3s;}
a:hover img{ filter: alpha(opacity=0); -ms-filter: alpha(opacity=0); opacity: 0.8; -webkit-transition: all .3s; transition: all .3s;}

/* ============================================
	全ページ共通部分
============================================ */
body{ padding:0px; margin:0px; font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;}

/*ChromeとOperaのみだけに適用されるCSSハック*/
_::content, _:future, body:not(*:root) { 
   font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
}

/*Firefoxだけに適用されるCSSハック*/
@-moz-document url-prefix() {
  body {
	 font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
  }
}

/*IE10以降に適用されるCSSハック*/
@media all and (-ms-high-contrast:none){
  body {
	 font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight:normal;
  }
}

/*Safariだけに適用されるCSSハック*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
  ::i-block-chrome, body {
	 font-family: "Hiragino Maru Gothic W4 JIS2004", "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 500;
  }
}

#wrapper{ width:1200px; padding:0px; margin:0px auto 0px auto; position:relative;}
#wrapper:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.contact_btn a{ display:block; width:760px; height:80px; background-color:#ff5500; font-size:36px; line-height:38px; color:#ffffff; text-align:center; margin:auto; padding:25px 0px 0px 0px;}


.pc{ display:block;}
.sp{ display:none;}

.fltL{ float:left;}
.fltR{ float:right;}

.alignC{ text-align:center;}
.alignL{ text-align:left;}
.alignR{ text-align:right;}

/* ============================================
	ヘッダエリア
============================================ */
.headarea{ width:1200px; height:60px; padding:0px; margin:10px auto 20px auto; position:relative;}
.headarea:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.logo{ width:309px; padding:0px; margin:0px; float:left;}
.logo img{ width:100%;}

/* ============================================
	ナビゲーションエリア
============================================ */
.navarea{ padding:0px 0px 0px 0px; margin:auto; font-weight:600; float:right;}
.navarea ul {
    padding: 7px;
    margin: 0px 0px 0px 0px;
    list-style: none;
    width: 870px;
}
.navarea ul:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.navarea li{ padding:30px 25px 0px 0px; float:left; color:#64c0eb; font-size:16px;}
.navarea li {
    padding: 3px 35px 0px 0px;
    float: none;
    color: #64c0eb;
    font-size: 16px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}
.navarea li.red {
    background: #fc521d;
    padding: 8px;
    padding-left: 12px;
    padding-right: 12px;
}
.navarea li.red a {
    color: #fff;
}

.navarea li a {
    display: block;
    color: #7f8080;
    line-height: 140%;
}
.navarea li a:hover{ background-color:rgba(255,255,255,0.2); -webkit-transition: all .3s; transition: all .3s; color:#64c0eb;}

.navarea li.red a:hover{ background-color:rgba(255,255,255,0.2); -webkit-transition: all .3s; transition: all .3s; color:yellow;}

/* ============================================
	フッタエリア
============================================ */
.footarea{ width:1200px; padding:0px; margin:15px auto 10px auto; position:relative;}
.footarea:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.f_nav{ width:800px; padding:30px 0px 0px 0px; margin:auto; float:left; font-size:14px; line-height:22px;}
.f_nav a{ padding:0px; margin:0px 10px 0px 5px; color:#323333;}

.footarea .f_logo{ width:400px; padding:0px; margin:auto; float:right; text-align:right;}
.footarea .f_logo img{ width:171px;}
.footarea p.copyright{ color:#7d7d7d; font-size:12px; line-height:14px; padding:10px 0px 0px 0px;}


@media screen and (max-width: 820px) {

/* ============================================
	全ページ共通部分
============================================ */
#wrapper{ width:95%; padding:0px; margin:0px auto 20px auto;}
#wrapper:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.contact_btn a{ display:block; width:100%; height:60px; background-color:#ff5500; font-size:24px; line-height:1.0em; padding:20px 0px 0px 0px;}

.pc{ display:none;}
.sp{ display:block;}

.fltL{ float:left;}
.fltR{ float:right;}

.alignC{ text-align:center;}
.alignL{ text-align:left;}
.alignR{ text-align:inherit;}


/* ============================================
	ヘッダエリア
============================================ */
.headarea{ width:100%; height:50px; padding:0px; margin:0px auto 0px auto; position:relative;}
.headarea:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}


/* ============================================
	ナビゲーションエリア
============================================ */
.navarea{ width:100%; padding:0px; margin:0px auto 0px auto; position:fixed; z-index:999; background-color:#ffffff;}
#menu {
    display: none;
    width: 100%;
    padding: 0px;
    margin: 0px;
    background-color: #f5f5f5;
}

#menu li {
    width: 100%;
    /* border-bottom: 1px solid #ffffff; */
    padding: 0px;
    margin: 0px;
    display: block;
}
#menu li:last-child{ width:100%; border-bottom:1px solid #e957a4;}
#menu li a.link01{ display:block; width:100%; height:auto; padding:15px 0px 15px 0px; font-size:16px; line-height:18px; vertical-align:middle; text-align:center; color:#323333; background-color:#f5f5f5;}
#menu li a.link02{ display:block; width:100%; height:auto; padding:15px 0px 15px 0px; font-size:16px; line-height:18px; vertical-align:middle; text-align:center; color:#ffffff; background-color:#f5f5f5;}

#toggle{ display:inline-block; position:relative; height:50px; z-index:1;}
#toggle a{ display:block; position:relative; width:50px; padding:10px 10px 0px 10px; color:#fff; text-align:center; text-decoration:none;}
#toggle a img{ width:100%;}

.logo_s{ width:100%; text-align:center; position:absolute; top:0px; z-index:0;}
.logo_s img{ width:150px; margin:10px 0px 0px 0px;}

.fixed { position: fixed; top: 0; left: 0; width: 100%;}


/* ============================================
	フッタエリア
============================================ */
.footarea{ width:100%; padding:0px; margin:15px auto 10px auto; position:relative;}
.footarea:after{ content: "."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}

.f_nav{ width:100%; padding:0px 0px 0px 0px; margin:auto; float:none; font-size:12px; line-height:1.5em; text-align:center;}
.f_nav a{ padding:0px; margin:0px 10px 0px 5px; color:#323333;}

.footarea .f_logo{ width:100%; margin:10px auto 0px auto; float:none; text-align:center;}
.footarea .f_logo img{ width:150px;}
.footarea p.copyright{ font-size:12px; line-height:1.2em;}

}



/* ============================================
	PC／スマホ 表示切り替え
============================================ */
@media only screen and (max-device-width: 480px) {
	/* スマホ非表示用のCSS */
.spnone { display: none;}
}
@media only screen and (min-device-width: 481px) {
	/* PC用のCSS */
.pcnone { display: none;}
}