@charset "UTF-8";
/*!
Theme Name: hsc_ultimate
Version: 20200206
*/


/*カスタムセット*/
/*メインカラー設定*/

:root {--maincolor:#FCB001;}

.maincolor {color: var(--maincolor);}
.maincolor_bg {background-color: var(--maincolor);}
.maincolor_border { border-color: var(--maincolor);}



/*初期化*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
* { margin: 0px; padding: 0px; line-height:1.15; word-wrap: break-word; vertical-align:middle;}
ul { list-style: none; }
ol  { display: block; text-align:left; list-style-type: disc; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start:1.5em; }
a {text-decoration:underline; font-size:100%; overflow:hidden; outline:none; }
img, a img { border: none; text-decoration:none; max-width:100%; }
.clearBoth { clear:both; font-size:1px; height:0; text-align:center; }
iframe { vertical-align: bottom;}
strong { font-weight:bold;}
main { position:relative; z-index:10;}
img { vertical-align: middle;}


/*---------------------------------------------------------
common
---------------------------------------------------------*/
html { font-size: 62.5%; }
/* Text elements */
body { font-size:1.6em; text-align: center; -webkit-text-size-adjust : 100%; height:100%;}
body { color:#333; }
h1,h2,h3,h4,h5,h6 { font-size:100%; text-align:center; margin-bottom:1.2rem;}
a { color: #666; text-decoration: none; }
a:hover { text-decoration:underline;}
a:hover { opacity: 0.5; filter: alpha(opacity=60); -ms-filter: "alpha( opacity=60 )"; }
ol { display: block; text-align:left; list-style-type: disc; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start:1.5em; text-align:left;}
dl { text-align:left;} dl dd:not(:last-child) { margin-bottom:1.7em;}

/*pの設定*/
p {text-align:left; line-height:1.45;}
h1+p,h2+p,h3+p,h4+p,h5+p,h6+p { margin-top:1rem;}
p+p { margin-top:19px; }/*pが連続していたら、マージン*/
.fa { margin-right:5px; font-size:130%;}/*アイコンフォントの右側のつまりすぎとちょっと小さいのを解消*/
@media screen and (min-width: 320px) and (max-width: 768px) {
p {font-size: 1.9rem;}
}





/*---------------------------------------------------------
レイアウト
---------------------------------------------------------*/
/*全体背景*/
#wrapper { }

/*ヘッダー設定*/
header { position:absolute; width:100%; background-color:rgba( 255, 255, 255, 0.8 ); }

/*キービジュアル設定*/
#keyvisual { }

/*ナビゲーション設定*/
nav { }/*背景*/

/*ナビゲーションの文字*/
ul#menu-glnv>li { padding:15px 0;}
ul#menu-glnv>li a { color: #F29100; font-size: 15px; font-weight: bold; text-decoration:none;}
/*ul#menu-glnv>li { background:url(/images/parts/navi.png) no-repeat }ナビゲーションの文字の間の装飾*/

#menu-glnv > li a:hover {}/*マウスオーバー時*/
.current-menu-item a { }/*ナビゲーションカレントの背景設定*/

/*ナビゲーション　プルダウンの設定*/
li ul.sub-menu { width:280px; }/*プルダウンの幅*/
ul#menu-glnv>li ul.sub-menu li a { color: #333 ; }/*プルダウンの文字の色*/
.sub-menu li { padding:15px 0;}/*プルダウンのメニュー間の装飾*/
ul#menu-glnv>li:first-child { background:none;}/*ナビゲーションの文字の間の装飾を一番最初は削除している*/
/*ul#menu-glnv>li.current-menu-item a { color: #FF0!important; background:none;}カレントメニューデザイン*/

@media screen and (min-width: 320px) and (max-width: 768px) {
nav {background-color:var(--maincolor);}/*背景*/
ul#menu-glnv>li a { color:#FFF;}
/*スマホメニューバー*/
.menu__line { background:var(--maincolor);   }
}

main { background-color:#FFF; position:relative; }

footer {}


/*レイアウト構成設定*/
.width { width:1080px; margin-left:auto; margin-right:auto;}
.contents { width:750px; float:left;}
#side_contents { width:220px; float:right;}
.f_col img { margin-bottom:1.2rem;}



/*タイトルデザイン*/
.title01 { position:relative; padding-bottom:2.0rem;  font-size:3.0rem; margin-bottom:3.0rem; text-align:center; letter-spacing:0; font-weight:bold;}
.title01:after {	margin-left: -75px;	position: absolute;	width: 150px;	height: 1px;	left: 50%;	bottom: 0;	border-bottom: 3px solid  var(--maincolor);	content: "";}

.title02 { position:relative;  padding-bottom:2.0rem;  font-size:2.8rem; margin-bottom:3.0rem; text-align:left; font-family: "Sawarabi Mincho";  font-weight:normal; }
.title02:after {position: absolute;width: 80%;height: 1px;left:0;bottom: 0;border-bottom: 1px solid #808000;content: "";}

.title03 { position:relative;  padding:20px; line-height:1.4; font-size:3.4rem; margin-bottom:30px; text-align:center; font-weight:bold;}
.title03:after {margin-left: -45px;	position: absolute;	width: 90px;	height: 1px;	left: 50%;	bottom: 0;	border-bottom: 2px solid #808000;	content: "";}
@media screen and (min-width: 320px) and (max-width: 768px) {
.title01 { font-size:3.2rem;}
}


/*ボタン
.btn01 { background-color:#FFF; font-weight:bold;  display: inline-block;border: solid #333 1px; padding:2.0rem; margin-top:3rem; text-align:center; /*  font-family: "Sawarabi Mincho"; 
-webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;  -webkit-transition: all .3s;  transition: all .3s;}
.btn01:hover {  background-color: #000; color:#FFF; text-decoration:none; opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha( opacity=100 )"; }
.btn01:before {   font-family: 'Material Icons';  content: "\e5e1"; margin-right:10px;}*/

.btn01 { position:relative; background-color:var(--maincolor); font-weight:bold; color:#FFF;  display: inline-block; padding:1.3rem 2rem; margin-top:2rem; text-align:center;  border-radius: 8px; font-size:90%; box-shadow: 0px -5px rgba(0,0,0,0.2) inset;}
.btn01:after {   font-family: 'Font Awesome 5 Free';  content: "\f105"; margin-left:10px;}
.btn01:hover { top: -4px; opacity: 1;}

@media screen and (min-width: 320px) and (max-width: 768px) {
.btn01{}
}



/*---------------------------------------------------------
追加オリジナルスタイル
---------------------------------------------------------*/

ul.newslist95 li { margin-bottom:15px; padding-bottom:15px; border-bottom:#CCC solid 1px; text-align:left;} 
ul.newslist95 li span { padding:0.6rem;  border-radius: 0px; display:inline-block; margin-left:20px; width:100px; text-align:center; font-size:1.4rem}

div.slider01 { margin-bottom:30px; box-shadow: 3px 3px 6px rgba(0,0,0,0.1); background-color:#FFF; width:700px; margin:2rem; padding:2rem}
@media screen and (min-width: 320px) and (max-width: 768px) {
div.slider01 { width:300px}
}

div.cs_style002 { border:solid 3px var(--maincolor); margin-top:5rem; margin-left:-30px; width:800px; padding:3rem; padding-left:5rem}
@media screen and (min-width: 320px) and (max-width: 768px) {
div.cs_style002 { width:92%; margin-left:2.5rem; margin-top:-50px; padding-top:60px;}
}