@charset "utf-8";

/*==========================================
 body
===========================================*/
body {width: 100vw;
color:#484848;
background-color:#ffffff;
/*background:#ffffff url(../images/bg.jpg);*/
text-align: left;
line-height: 1.8;
letter-spacing: -0.001em;		/* iOS4でのテキストの隙間への対応 */
-webkit-text-size-adjust: 100%;		/* 文字サイズの自動調整機能のキャンセル */
}

/*==========================================
 header
===========================================*/
header {width: 100vw;
position: fixed;
top: 0;
left: 0;
z-index:888;
margin: 0;
padding-top: 2px;
padding-bottom:2px;
background-color:#ffffff;
-webkit-box-shadow: 2px 2px 8px 0 rgba(0,0,0,0.8);
box-shadow: 2px 2px 8px 0 rgba(0,0,0,0.8);
border-bottom:1px solid #cccccc;}
header h1 {padding: 2px; color: #24335e; font-size: 1.2em; font-weight: bold;}
header h1 span{display: block; font-size: 0.8em; font-weight:normal;}
header p {color:#cccccc;}

/*==========================================
 Mainvisual
===========================================*/
#mainvisual {width: 100vw; height: 80vh; margin: 0; padding: 0;
-webkit-scroll-behavior: smooth;
scroll-behavior: smooth;
-webkit-scroll-snap-type: mandatory;
scroll-snap-type: mandatory;
-webkit-scroll-snap-points-y: repeat(80vh);
scroll-snap-points-y: repeat(80vh);}

#mainvisual p {font-size: 1.18em; font-weight:normal; padding: 88px 0 0; color: #333333; letter-spacing:1px;}

#mainvisual h1 {margin: 0 auto 0; padding: 0;
text-align: center;
position: absolute;
top: 50%; left: 50%;
-ms-transform: translate(-50%,-50%);
-webkit-transform : translate(-50%,-50%);
transform : translate(-50%,-50%);
width: 100%;
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#mainvisual h1 span{display: block; font-size: 0.8em; font-weight:normal;}

/*==========================================
 title_con
===========================================*/
#title_cont {width: 100vw;}

/*==========================================
 Contentstop
===========================================*/
#contentstop {width: 100vw;
margin: 0 auto 48px;
padding: 28px 0;
position: relative;
background-color: #dddddd;

/*
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-image: url(../images/top_img001.jpg);
background-position: 50% 50%;
background-repeat:no-repeat;
margin: 0 auto 0px; position: relative;
*/
}

#contentstop:after	{
content: '';
position: absolute;
top: 100%;
left: 50%;
border: solid transparent;
height: 0;
width: 0;
pointer-events: none;
border-color: rgba(221,221,221, 0);
border-top-color: #dddddd;
border-width: 48px;
margin-left: -48px;
}

#contentstop h5 {font-size: 1.18em; font-weight: bold; margin:0; color: #24335e;}
#contentstop p {font-size: 1.08em; margin:0 auto 28px; color: #333333;}

/*==========================================
 Contents
===========================================*/
#contents {width: 100vw; margin: 0 auto 0;}
#contents section {width: 100%; margin:38px auto; padding:0; /*border-top: solid 1px #cccccc;*/}
#contents p {margin: 0 0 8px;}
#contents table p{margin: 0 0 2px; font-size: 0.89em;
}


/*==========================================
 Sidebar
===========================================*/
#sidebar {margin-top: 28px; border-top: solid 1px #dddddd;}
#sidebar aside {border-bottom: solid 1px #cccccc; }
#sidebar aside a {
display: block;
position: relative;			/* ボックス全体にposition:relativeを指定 */
padding: 8px 30px 8px 0px;
text-decoration: none;
overflow: hidden;}

#sidebar aside a:after {color: #cccccc;
  font-family: "Font Awesome 5 Free";
  font-weight: bold;
  font-size: 1.8em;
  content: "\f105";
display: block;
position: absolute;/* position:absoluteでボックスの右側にリンクアイコンを配置 */
width: 10px;
line-height: 10px;
top: 50%;/* リンクアイコンを上下中央に配置 */
margin-top: -5px;
transition-duration: 0.3s;}

#sidebar h4 {margin:18px 0 0 2px; color: #555555; /* font-weight: bold;*/ font-size: 1.18em;}
#sidebar p {margin:0 0 18px 2px; font-size:0.88em; color: #777777;}
#sidebar img{margin:18px auto;}

#sidebar aside a:link,
#sidebar aside a:visited {background-color: transparent;}

#sidebar aside a:hover,
#sidebar aside a:active {background-color: #f5f5f5;}

#sidebar aside a:link:after,
#sidebar aside a:visited:after {right: 6px;/* リンクアイコンを右端から6pxに配置*/}

#sidebar aside a:hover:after,
#sidebar aside a:active:after {right: 3px;/* マウスオーバー時にリンクアイコンの位置をずらす */}

/*
#contents #PAYMENT001 {margin-top:-88px; padding-top:88px;}
#contents #PAYMENT002 {margin-top:-88px; padding-top:88px;}
#contents #PAYMENT003 {margin-top:-88px; padding-top:88px;}
#contents #PAYMENT004 {margin-top:-88px; padding-top:88px;}*/

/*==========================================
 Contents-2col
===========================================*/
#contents-2col {width: 100vw;
margin: 38px auto 0;
padding:38px 0px;
/*background: #f29301;*/
background: #008934; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #008934 0%, #055137 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #008934 0%,#055137 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #008934 0%,#055137 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008934', endColorstr='#055137',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#contents-2col section p {margin:0 auto 18px; padding:0;}


/*==========================================
 Contentssub
===========================================*/
#contentssub {width: 100vw;
margin: 0 auto;
padding:18px 0;
position: relative;
/*background-color: #282828;*/
background: rgb(37,141,200); /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, rgba(37,141,200,1) 0%, rgba(36,51,94,1) 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, rgba(37,141,200,1) 0%,rgba(36,51,94,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, rgba(37,141,200,1) 0%,rgba(36,51,94,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#258dc8', endColorstr='#24335e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

/*
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-image: url(../images/top_img001.jpg);
background-position: 50% 50%;
background-repeat:no-repeat;
margin: 0 auto 0px; position: relative;
*/
}
/*
#contentssub:after	{
content: '';
position: absolute;
top: 100%;
left: 50%;
border: solid transparent;
height: 0;
width: 0;
pointer-events: none;
border-color: rgba(62, 169, 225, 0);
border-top-color: #3EA9E1;
border-width: 48px;
margin-left: -48px;
}
*/

/*==========================================
 Footer
===========================================*/
#footer {width: 100vw; margin:0 auto;
color: #333333;
background-color: #bbbbbb;
}

footer a:link,
footer a:visited {color: #333333; text-decoration: none;}
footer a:hover,
footer a:active {color: #ffffff; text-decoration: none;}
.footer_nav {overflow: hidden; float: left;}
.footer_nav ul{margin: 0; padding: 0; list-style: none}
.footer_nav li {float: left; margin: 0 8px; padding: 0;}
.footer_nav li a:before {color:#ffffff; margin:0 4px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f105";}
.company {overflow: hidden; float: left; font-size:0.8em;}
.company ul{margin: 0; padding: 0; list-style: none}
.company li {float: left; margin: 0 8px; padding: 0;}
.company li a:before {color:#ffffff; margin:0 4px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f105";}
.company li.none {display: none;}
address {overflow: hidden; font-size: 0.8em; float: right;}



