@charset "utf-8";

@import url(./basic.css);
@import url(./size.css);
@import url(./lightbox.css);
@import url(../css/all.min.css);

.wbasic {
	width: 1000px;
	margin:0 auto;
}

/* 印刷用CSS */
@media print {
  .print {
    display: none;
  }
}

.js-print-btn {
	background-color: #4174b2;
	border:2px solid #c9c9c4;
	padding: 10px;
	color:#fff;
	text-align: center;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */  
}
.js-print-btn  a {
	color:#fff;
}
.js-print-btn  a {
	color:#fff;
}

@media screen and (max-width: 1024px) { /* forSMP */
.wbasic {
	width: 100%;
	padding:0 16px;
}
}
a { 
    color: #333;
	text-decoration: none;
}

a:visited { 
    color: #333;
	text-decoration: none;
}
a:hover { 
    color: #afafb0;
	text-decoration: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* mouseOver */
a:hover img {
	opacity:0.6;
	filter: alpha(opacity=80);
	ms-filter: "alpha( opacity=80 )";
}

.box_Olink{
background-color: #fdd562;
padding:1.0em;
text-align: center;
font-weight: bold;
font-size:1.2rem;
border-radius:30px;
}

.box_Olink a{
color:#221815;
}

.box_Blink{
background-color: #30B7B0;
padding:1.0em;
text-align: center;
font-weight: bold;
font-size:1.2rem;
border-radius:30px;
}

.box_Blink a{
color:#fff;
}
.box_Blink i{
color:#fff;
}

.link_f0a023 {
position: relative;/*相対位置*/
padding: 0.4em 0.6em 0.4em 2.4em;/*アイコン分のスペース*/
line-height: 1.4;/*行高*/
font-size: 1.0em;
}
.link_f0a023 a {
color: #333;
}
.link_f0a023 a:hover {
color: #afafb0;
}
.link_f0a023:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f0c1";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size: 1.2em;/*サイズ*/
left: 0.4em;/*アイコンの位置*/
top: 0.2em;/*アイコンの位置*/
color: #f0a023; /*アイコン色*/
}
.box_head_bn {
position:relative;
padding:0.8em 0em 0.6em 3.2em;
line-height:1.4em;
margin-bottom:20px;
font-size:1.2em;
border:2px solid #4174b2;
}
.box_head_bn:before {
font-family:FontAwesome;
content:"\f815";
position:absolute;
font-size:1.6em;
left:0.4em;
top:0.5em;
color:#4174b2;
}
.box_head_bn a {
color:#333;
}
.box_head_bn a:hover{
color:#4174b2;
}
.btn,
a.btn,
button.btn {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.2rem 2rem 1rem 5.2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;

  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  border-radius: 0.5rem;
color:#fff;
background-color: #4174b2;
}

.btn:before,
a.btn:before,
button.btn:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f15b";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.4em;/*サイズ*/
left: 1.0em;/*アイコンの位置*/
top: 0.4em;/*アイコンの位置*/
color: #fff;/*アイコン色*/
}
.btn_movie,
a.btn_movie {
  font-size: 1.0rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.0rem 2rem 0.8rem 3.6rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;

  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  border-radius: 0.5rem;
color:#fff;
background-color: #4174b2;
}

.btn_movie:before,
a.btn_movie:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f03d";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.2em;/*サイズ*/
left: 1.0em;/*アイコンの位置*/
top: 0.7em;/*アイコンの位置*/
color: #fff;/*アイコン色*/
}

.btn_login,
a.btn_login,
button.btn_login {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.2rem 2rem 1rem 5.2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;

  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  border-radius: 0.5rem;
color:#fff;
background-color: #4174b2;
}

.btn_login:before,
a.btn_login:before,
button.btn_login:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f2f6";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.4em;/*サイズ*/
left: 1.0em;/*アイコンの位置*/
top: 0.4em;/*アイコンの位置*/
color: #fff;/*アイコン色*/
}

.btn_register,
a.btn_register,
button.btn_register {
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1.2rem 2rem 1rem 5.2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;

  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  border-radius: 0.5rem;
color:#fff;
background-color: #4174b2;
}

.btn_register:before,
a.btn_register:before,
button.btn_register:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f2c2";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.4em;/*サイズ*/
left: 1.0em;/*アイコンの位置*/
top: 0.4em;/*アイコンの位置*/
color: #fff;/*アイコン色*/
}


a.btn-radius-solid {
  border: 1px solid #c9c9c4;
  background: #4174b2;
  background: -webkit-gradient(linear, left top, left bottom, from(#4174b2), to(#82cddd));
  background: -webkit-linear-gradient(top, #4174b2 0%, #82cddd 100%);
  background: linear-gradient(to bottom, #4174b2 0%, #82cddd 100%);
  -webkit-box-shadow: inset 1px 1px 1px #fff;
  box-shadow: inset 1px 1px 1px #fff;
}

a.btn-radius-solid:hover {
  background: -webkit-gradient(linear, left bottom, left top, from(#4174b2), to(#a1d8e6));
  background: -webkit-linear-gradient(bottom, #4174b2 0%, #a1d8e6 100%);
  background: linear-gradient(to top, #4174b2 0%, #a1d8e6 100%);
}
/********* nav *********/
nav {
margin-bottom: 6px;
}

@media screen and (min-width: 600px) { /* forPC */
.dropmenu{
  height:auto;	
  *zoom: 1;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.dropmenu:before, .dropmenu:after{
  content: "";
  display: table;
}
.dropmenu:after{
  clear: both;
}
.dropmenu ul{
display: flex;
}
.dropmenu li{
flex: 1 1;
  position: relative;
  width: 25%;
  float: left;
font-size:1.0em;
  margin: 0;
  padding: 0;
}
.dropmenu li::after {
  content: "";
  display: block;
  width: 1px;
  height: 20px;
  background-color: #CCC;
  position: absolute;
  right: -1px;
  top: calc((100% - 20px)/2);
}
.dropmenu li:last-child::after {
  content: none;
}

.dropmenu li a {
	display: block;
	text-align: center;
	text-decoration: none;
}
.dropmenu li ul{
  list-style: none;
  position: absolute;
  z-index: 9999;
  top: 100%;
  left: 0;
  margin: 0;
  padding: 0;
}
.dropmenu li ul li{
  width: 100%;
}
.dropmenu li ul li a{
}
.dropmenu li:hover > a{
}
.dropmenu li.normal a:hover{
}

#menu{
}
	
#menu li ul{
  opacity: 0;
  top: 50%;
  visibility: hidden;
  transition: .5s;
}
#menu li:hover ul{
  top: 100%;
  visibility: visible;
  opacity: 1;
}
}

@media screen and (max-width: 599px) { /* forSMP */
#gnav-btn {
    color: #4174b2;
    padding: 10px;
    font-size: 40px;
    position: fixed;
    top: 8px;
    right: 8px;
    z-index: 101;
    background-color: white;
    border: solid 1px #4174b2;
    border-radius: 3px;
  }
#gnav-input:checked ~ #gnav-content {
    top: 0;
  }
#gnav-content {
    position: fixed;
    top: -100%;
    right: 0;
    z-index: 100;
    transition: 0.3s;
    width: 70%;
	font-size:1.2em;
	/*color:#333;
line-height:1.6em;*/
background-color: rgba(65,116,178,0.8);
  }
.humb-menu__title {
    padding: 0.0rem;
  }
.humb-menu label {
    display: flex;
    justify-content: space-between;
    padding: 0.6rem 6.0rem 0.6rem 1.2rem;
    cursor: pointer;
    border-top: 0.5px solid #c7c5c5;
  }
.humb-menu label a {
	color:#fff;
  }
.humb-menu input {
    display: none;
  }
.humb-menu .accshow {
    height: 0;
    overflow: hidden;
  }
.humb-menu .accshow p {
    padding: 0 0 0.4em 1.0em;
  }
.humb-menu .accshow p a {
	color:#fff;
  }
.humb-menu .cssacc:checked + .accshow {
    height: auto;
  }
}
@media screen and (min-width:600px) and ( max-width:1024px)  { /* forSMP */
#gnav-btn {
    color: #4174b2;
    padding: 10px;
    font-size: 40px;
    position: fixed;
    top: 8px;
    right: 8px;
    z-index: 101;
    background-color: white;
    border: solid 1px #4174b2;
    border-radius: 3px;
  }
#gnav-input:checked ~ #gnav-content {
    top: 0;
  }
#gnav-content {
    position: fixed;
    top: -100%;
    right: 0;
    z-index: 100;
    transition: 0.3s;
    width: 50%;
	font-size:1.2em;
	/*color:#333;
line-height:1.6em;*/
background-color: rgba(65,116,178,0.8);
  }
.humb-menu__title {
    padding: 0.0rem;
  }
.humb-menu label {
    display: flex;
    justify-content: space-between;
    padding: 0.6rem 6.0rem 0.6rem 1.2rem;
    cursor: pointer;
    border-top: 0.5px solid #c7c5c5;
  }
.humb-menu label a {
	color:#fff;
  }
.humb-menu input {
    display: none;
  }
.humb-menu .accshow {
    height: 0;
    overflow: hidden;
  }
.humb-menu .accshow p {
    padding: 0 0 0.4em 1.0em;
  }
.humb-menu .accshow p a {
	color:#fff;
	font-size:0.6em;
  }
.humb-menu .cssacc:checked + .accshow {
    height: auto;
  }
}

@media screen and (max-width: 599px) { /* forSMP */
footer{
padding: 0;		
}
/*メニューをページ下部に固定*/
#sp-fixed-menu{
   position: fixed;
   width: 100%;
   bottom: 0px;
   opacity: 0.9;
   z-index: 99;
}

/*メニューを横並びにする*/
#sp-fixed-menu ul{
   display: flex;
   list-style: none;
   padding:0;
   margin:0;
   width:100%;
}

#sp-fixed-menu li{
   justify-content: center;
   align-items: center;
   width: 25%;
   padding:0;
   margin:0;
line-height: 22px;
   border-right: 1px solid #fff;
}
#sp-fixed-menu li+ li {
border-left: 0;
}
#sp-fixed-menu li i{
}
#sp-fixed-menu li span{
font-size: 1.0em;
font-weight:600;
}
#sp-fixed-menu li:first-child{
   background: #29629f;
}
#sp-fixed-menu li:nth-child(2) {
   background: #00a1e9;
}
#sp-fixed-menu li:nth-child(3) {
   background: #d70035;
}
#sp-fixed-menu li:last-child{
   background: #ad9e74;
}

/*ボタンを調整*/
#sp-fixed-menu li a{
   color: #fff;
   text-align: center;
   display:block;
   width: 100%;
   padding:8px;
}

#footer {
	background-color: transparent;
}
.fWidth{
	width:100%;
}
}

/* blog_txt */
.blog_txt{
border-top: 2px solid #ad9e74;
border-bottom: 2px solid #ad9e74;
padding: 40px 20px;
}

.blog_txt_top{
border-bottom: 2px solid #ad9e74;
padding: 10px 20px;
}

/* main */
main{
}
article {
	min-height: 400px;
	height: auto !important;
	height: 400px;
}

@media screen and (max-width: 599px) { /* forSMP */
/* blog_txt */
.blog_txt{
padding: 20px 20px;
}
article {
	float: none;
	width: auto;
}
}
strong{
font-weight: 600;
}

.pBas {
	font-size:100%;
	margin-bottom: 40px;
}
.pBas_b10 {
	font-size:100%;
	margin-bottom: 10px;
}
.pBas_b0 {
	font-size:100%;
	margin-bottom: 0px;
}
.pBas_grey {
	color:#bdc6cf;
	font-size:3.0em;
}
.pBas_blue {
	color:#587abb;
	font-size:2.4rem;
	font-weight:bold;
	line-height: 3.2rem;
	text-align: center;
	margin-bottom: 40px;
}

.pAnswer{
padding: 10px 14px;
font-size:16px;
margin-left: 20px;
	line-height:2.0em;
	margin-bottom: 30px;	
}
.pAnswer span{
	font-size:140%;
}
.news-list{
  list-style: none outside;
  margin: 0;
  padding: 0;
}
.news-list .item a{
  display: flex;
  flex-wrap: wrap;
  flex-wrap: nowrap;
  text-decoration: none;
  color: #333;
  border-bottom: 1px solid #CCC;
  padding: 20px 20px;
}
.news-list .item:first-child a{
  border-top: 1px solid #CCC;
}
.news-list .item .date{
  margin: 0;
  min-width: 140px;
  font-size: 16px;
  color: #999;
  padding: 0 20px 0 0;
}
.news-list .item .category{
  margin: 0;
  min-width: 140px;
  padding: 0 20px 0 0;
}
.news-list .item .category span{
  background: #999;
  color: #FFF;
  text-align: center;
  display: inline-block;
  padding: 5px 20px;
  font-size: 12px;
  line-height: 1;
}
.news-list .item .title{
  margin: 0;
  width: 100%;
}
.news-list .item a:hover .title{
  color: #afafb0;
}

@media screen and (max-width: 599px){
.news-list .item a{
  flex-wrap: wrap;
}
.news-list .item .date{
  min-width: 100px;
}
.news-list .item .title{
  margin-top: 10px;
}
.pBas{line-height:1.8rem;}
.pBas_blue {font-size:1.34rem;line-height: 2.0rem;
}
}

#pc{
margin-top:14px;
margin-left: 14px;
width:100px;
height:100px;
background-image:url("/homepage/img/pc.png");
float:left;}
.h1-1{
color:#393;
padding:1.2em 0 1.0em 3.2em;
border-top:2px solid #396; 
border-bottom:2px solid #396;
font-family:	"Lucida Grande", "segoe UI", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", Meiryo, Arial, sans-serif;
font-size:2.6em;
margin-bottom: 40px;
}
.h1-1 span{
font-size:28px;
}
.h2marugo{
color:#555;
letter-spacing:0.1em;
font-size:26px;
padding: 8px;
border-bottom:1px dotted #396;
margin-bottom: 20px;
font-family:	"Lucida Grande", "segoe UI", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic ProN", Meiryo, Arial, sans-serif;
}
.h2marugo i{
color:#396;
}
.h2top {
font-size:2.4rem;
font-weight: normal;
text-align: center;
line-height: 2.8rem;
letter-spacing: 0.30vw;
margin-bottom: 20px;
}
.h2top span{
font-size:20px;
}
.h2 {
font-size:2.4em;
background-color:#f0a023;
letter-spacing: 0.30vw;
line-height: 1.2em;
padding:0.4em 0 0.4em 0;
color:#fff;
text-align: center;
margin-bottom: 40px;
}
.h2 span{
font-size:16px;
}
.h2blue {
font-size:2.4em;
background-color:#587abb;
letter-spacing: 0.30vw;
line-height: 1.2em;
padding:0.4em 0 0.4em 0;
color:#fff;
text-align: center;
margin-bottom: 40px;
}
.h2_b20 {
font-size:2.4em;
background-color:#f0a023;
letter-spacing: 0.30vw;
/*line-height: 0.8em;*/
padding:0.6em 0 0.4em 0;
color:#fff;
text-align: center;
margin-bottom: 20px;
}
.h2_b20 span{
font-size:16px;
}
.h3 {
font-size:1.4em;
position: relative;
padding: 0em 0 0.8em 1.0em;
margin-bottom: 30px;
}
.h3::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #30B7B0;
border-bottom: 1px solid #30B7B0;
}
.h3bleft{
font-size:1.4em;
border-left:8px solid #439acf;
padding: 0.4em 0 0.4em 0.8em;
margin-bottom: 30px;}
.h3bleft_O{
font-size:1.4em;
border-left:8px solid #f0a023;
padding: 0.4em 0 0.4em 0.8em;
margin-bottom: 30px;}
.h3bleft_O span{font-size:1.6em;color:#f0a023;}
.h3center {
font-size:1.4em;
position: relative;
text-align: center;
padding: 0em 0 0.8em 0em;
margin-bottom: 30px;
}
.h3center::after {
position: absolute;
content: '';
left: 0;
bottom: 0;
width: 100%;
height: 7px;
box-sizing: border-box;
border-top: 3px solid #4174b2;
border-bottom: 1px solid #439acf;
}
.h4 {
position: relative;/*相対位置*/
font-size:1.4em;
padding: 0.4em 0 0.4em 2.0em;
border-bottom: 2px dotted #439acf;
margin-bottom: 20px;
}
.h4:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f138";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.2em;/*サイズ*/
left: 0.2em;/*アイコンの位置*/
top: 0.3em;/*アイコンの位置*/
color: #f0a023; /*アイコン色*/
}
.h4B {
position: relative;/*相対位置*/
font-size:1.4em;
padding: 0.4em 0 0.4em 2.0em;
border-bottom: 2px dotted #30B7B0;
margin-bottom: 20px;
}
.h4B:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f138";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.2em;/*サイズ*/
left: 0.2em;/*アイコンの位置*/
top: 0.3em;/*アイコンの位置*/
color: #F08449; /*アイコン色*/
}
.h4_blue {
position: relative;/*相対位置*/
font-size:1.4em;
padding: 0.4em 0 0.4em 2.0em;
border-bottom: 2px dotted #439acf;
margin-bottom: 20px;
}
.h4_blue:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f138";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.2em;/*サイズ*/
left: 0.2em;/*アイコンの位置*/
top: 0.4em;/*アイコンの位置*/
color: #439acf; /*アイコン色*/
}
.h4_blue span{font-size:1.4em;color:#439acf;}
.h5 {
  padding: 0.2em 1.0em 0.2em 1.0em;
  margin-bottom:10px;
  font-size:1.4em;
font-weight: 500;
color: #fff;
font-weight: 600;
background-color: #f0a023;
}
.h5blue {
  padding: 0.2em 0;
  margin-bottom: 4px;
  font-size:1.4em;
font-weight: 500;
color: #005fa8;
}

.h5pdf {
position: relative;/*相対位置*/
padding: 0.4em 0 0.4em 2.0em;
border-bottom:2px dotted #f0a023;
margin-bottom: 10px;
line-height: 1.6em;
font-size:1.1em;
}
.h5pdf:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f1c1";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size:1.4em;/*サイズ*/
left: 0.2em;/*アイコンの位置*/
top: 0.3em;/*アイコンの位置*/
color: #f0a023; /*アイコン色*/
}
.h6 {
  padding: 0.6em 0 0.2em 0.8em ;
  margin-bottom: 10px;
  font-size:1.2em;
font-weight: 500;
border-bottom: 1px solid #005fa8;
color: #005fa8;
}
.link_movie{
margin-bottom: 30px;
}
.link_movie a {
position: relative;/*相対位置*/
padding: 0em 0em 0em 2.0em;/*アイコン分のスペース*/
color:#00ac9a;/*文字色*/
font-size: 1.0em;
}
.link_movie a:before{ font-family: FontAwesome;/*忘れずに*/
content: "\f03d";/*アイコンのユニコード*/
position: absolute;/*絶対位置*/
font-size: 1.2em;/*サイズ*/
left: 0.2em;/*アイコンの位置*/
top: -0.4em;/*アイコンの位置*/
color:#00ac9a;/*アイコン色*/
}
.link_movie a:hover {
color:#fcc800;
}

.skuform{
	text-align: center;
	margin-bottom: 50px;
}
.field_price{
	color:#00afcc;
	font-size: 32px;
	padding: 10px;
	margin-bottom: 30px;
}
.skubutton{
	background-color: #ff4500;
	padding: 10px;
	color:#fff;
	font-size:24px;
}

@media screen and (max-width: 599px) { /* forSMP */
.h2{
padding:12px 0 12px 0;
font-size:28px;
line-height: 36px;
margin-bottom: 30px;
}
.h2blue{
padding:12px 0 12px 0;
font-size:28px;
line-height: 36px;
margin-bottom: 30px;
}
.h2top {
font-size:1.6rem;
line-height: 2.4rem;
margin-bottom: 20px;}
#pc{
margin-top:12px;
margin-left:0px;}
.h1-1{
padding:0.8em 0 0.6em 2.0em;
font-size:32px;
line-height: 40px;
margin-bottom: 30px;
}
.h1-1 span{
font-size:24px;
}
}

/* pagetop */
#pagetop {
	position: fixed;
	bottom:20px;
	right: 20px;
	font-size: 1.4em;
	opacity:1;
}

#pagetop a {
	text-decoration: none;
	color: #FFF;
	width: 60px;
	text-align: center;
	display: block;
	border-radius: 40px;
	padding: 10px;
	background-color: #F08449;
}

#pagetop a:hover {
opacity:0.8;
}

@media screen and (max-width: 599px) { /* forSMP */
#pagetop {
	bottom: 8px;
	right: 8px;
}
#pagetop a {
	width: 50px;
	padding: 8px;
border-radius: 0px;
}
}

/* crear */
.clearfix {
	overflow:hidden;
	zoom: 1;
}
.clearfix:after {
	content: ".";
	display: block;
	height: 0px;
	clear: both;
	visibility: hidden;
}