@charset "euc-jp";


html {
width:100%;
}
/*
body {
margin:20px auto 0;
color: #333333;
font-size: 14px;
}
*/
body {
margin:0 auto 0;
color: #333333;
font-size: 14px;
background:url("../images/common/bg.jpg") repeat-x top center fixed;
font-family: 'Hiragino Kaku Gothic Pro','¥á¥¤¥ê¥ª','Meiryo','Yu Gothic','MS PGothic','sans-serif';
}
h1,h2,h3,h4,p,span,ul,li {
margin:0;
padding:0;
}
h4 {
font-size: 18px;
}
ul,li {
list-style:none;
}
a {
color :#333333;
text-decoration: none;
}

.slick-prev, .slick-next,.conf-spver-close {
display: none !important;
}
/* iOS */
input[type="submit"],
input[type="text"],
select {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="text"]::-webkit-search-decoration,
select::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="text"]::focus,
select::focus {
outline-offset: -2px;
}




.textlink{
color: #333333;
}

.textlink:hover{
text-decoration: underline;
color: #0066C0;
}


p {
line-height: 25px;
}
img {
width: 100%;
display: block;
height: auto;
}
iframe {
width: 100%;
}
.colorlink {
color: blue;
}
.colorlink:hover {
text-decoration: underline;
}
#header,
#gNav,
#page,
.ftcont {
max-width: 980px;
margin:0 auto;
}
.datacheck_img {
width: 50%;
display: block;
box-sizing: border-box;
padding: 20px 20px 0;
}
/*--header--*/
.hd_first {
display: flex;
justify-content: space-between;
}
.hd_first h1 {
font-size: 12px;
}
.shortlink {
font-size: 12px;
}
.shortlink a {
font-size: 12px;
padding: 0 5px;
border-right:solid 1px #333;
}
.shortlink a:last-child {
border:none;
padding:0;
}


.allbtn {
display: flex;
}
.allbtn li {
width: 15.36%;
border: solid 1px #acacac;
background: linear-gradient(0deg,black 0%,#2e2d2d 50%,#989898 100%);
}
.allbtn li:last-child{
width: 7.82%;
background: linear-gradient(180deg,#EF1111,#790C0C);
}
.allbtn li:not(:last-child):hover {
background: linear-gradient(0deg,black 0%,#5d5d5d 50%,#989898 100%);
}
.allbtn li a {
display: block;
width: 100%;
color: #fff;
text-decoration: none;
text-align: center;
font-weight: 700;
padding: 10px 0;
}
.allbtn li:last-child a {
background-image: url(/base/images/cart.svg);
background-repeat: no-repeat;
background-position: center;
background-size: auto;
}


.riyou {
margin: 15px;
}
.riyou li {
list-style: disc;
}










#contents {
display: flex;
padding: 0 16px;
justify-content: space-between;
background: #FFF;
}


@media screen and (max-width: 680px) {
#contents {
padding: 0 16px;
}
}




#main {
width: auto;
width: -webkit-fill-available;
}





/*--main--*/
section {
margin-bottom: 22px;
}





















/* Column-3 */
*, *:before, *:after {
box-sizing: border-box;
}
.col-3{
width: 100%;
display: flex;
display: -ms-flexbox;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
}
.col-3 p{
margin-top: 6px;
line-height: 180%;
}
.col-3 h3{
font-size: 120%;
margin-bottom: 4px;
text-align: center;
}
.col-3 .left{
width: 32.333%;
margin-right: auto;
margin-bottom: 14px;
}
.col-3 .center{
width: 32.333%;
margin-right: auto;
margin-bottom: 14px;
}
.col-3 .right{
width: 32.333%;
margin-bottom: 14px;
}
@media screen and (max-width: 680px) {
.col-3{
width: 100%;
display: flex;
display: -ms-flexbox;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
font-size: 12px;
}
.col-3 h3{
font-size: 120%;
margin-bottom: 4px;
text-align: center;
}
.col-3 .left{
width: 32.333%;
margin-right: auto;
}
.col-3 .center{
width: 32.333%;
margin-right: auto;
}
.col-3 .right{
width: 32.333%;
}
}













/* col_4 */
*, *:before, *:after {
box-sizing: border-box;
}
.col_4{
width: 100%;
display: flex;
display: -ms-flexbox;
flex-wrap: wrap;
-ms-flex-wrap: wrap;
}
.col_4 > .left1{
width: 25%;
padding: 20px;
background:rgba(225,225,225,0.40);
}
.col_4 > .left2{
width: 25%;
padding: 20px;
background:rgba(225,225,225,0.20);
}
.col_4 > .right1{
width: 25%;
padding: 20px;
background:rgba(225,225,225,0.40);
}
.col_4 > .right2{
width: 25%;
padding: 20px;
background:rgba(225,225,225,0.20);
}

@media screen and (max-width: 960px) {
.col_4 > .left1{
width: 100%;
padding: 25px;
background:rgba(225,225,225,0.40);
}
.col_4 > .left2{
width: 100%;
padding: 20px;
background:rgba(225,225,225,0.20);
}
.col_4 > .right1{
width: 100%;
padding: 20px;
background:rgba(225,225,225,0.40);
}
.col_4 > .right2{
width: 100%;
padding: 20px;
background:rgba(225,225,225,0.20);
}
}
/* col_4 */

/* voice */
.voice{
font-size: 90%;
}
.balloon1 {
position: relative;
display: inline-block;
margin: 0.6em 0 1.6em 0;
padding: 12px;
min-width: 204px;
max-width: 100%;
color: #555;
background: #FFF;
border: 1px rgba(255,35,35,0.70) solid;
text-align: center;
}

.balloon1:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -12px;
border: 12px solid transparent;
border-top: 12px solid rgba(255,35,35,0.70) ;
}

.balloon1 p {
margin: 0;
padding: 0;
font-size: 90%;
font-weight: 600;
}

.balloon2 {
width: 100%;
margin: 0.8em 0;
overflow: hidden;
}

.balloon2 .faceicon {
float: left;
margin-right: -90px;
width: 80px;
}

.balloon2 .faceicon img{
width: 50%;
height: auto;
}

.balloon2 .chatting {
width: 100%;
}

.personal {
display: inline-block;
position: relative;
margin: 5px 0 0 50px;
padding: 4px 13px;
border-radius: 12px;
}

.personal p {
margin: 0;
padding: 0;
font-size: 90%;
}

@media screen and (max-width: 960px) {
.balloon1 {
position: relative;
display: inline-block;
margin: 0.6em 0 1.6em 0;
padding: 12px;
width: 100%;
color: #555;
background: #FFF;
border: 1px rgba(255,35,35,0.70) solid;
text-align: center;
}

.balloon1:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -12px;
border: 12px solid transparent;

border-top: 12px solid rgba(255,35,35,0.70) ;
}

.balloon1 p {
margin: 0;
padding: 0;
font-size: 90%;
font-weight: 600;
}
.balloon2 .personal p{
margin-top: 20px;
margin-left: 30px;
}
.balloon2 .personal br{
display: none;
}
}
/* voice */

/* margin */
.mb10{
margin-bottom: 10px;
}
.mb20{
margin-bottom: 20px;
}
.mb30{
margin-bottom: 30px;
}
.mb40{
margin-bottom: 40px;
}
.mb200{
margin-bottom: 200px;
}
.mg4{
margin-top: 4px;
}
.mg10{
margin: 10px 10px 0 10px;
}
.mt10{
margin-top: 10px;
}
.mt20{
margin-top: 20px;
}
/* margin */

/* padding */
.pt30{
padding-top: 30px;
}
.pt40{
padding-top: 40px;
}
.pd8{
padding: 8px;
}
.pd10{
padding: 0 10px;
}
.pd20{
padding: 20px;
}
.pd30{
padding: 30px;
}
.pb6{
padding-bottom: 6px;
}
.pb10{
padding-bottom: 10px;
}
.pb20{
padding-bottom: 20px;
}
.pr10{
padding-right: 10px;
}

/* border */
.border1{
border: rgba(214,214,214,1.00) 1px solid;
padding: 10px;
}




/* txt-size */
.txt-size12{
font-size: 12px;
}
.txt-size14{
font-size: 14px;
}
.txt-size16{
font-size: 16px;
}
.txt-size18{
font-size: 18px;
}
.txt-size20{
font-size: 20px;
}
.txt-size24{
font-size: 24px;
}
.txt-size26{
font-size: 26px;
font-weight: 600;
}
.txt-size32{
font-size: 32px;
font-weight: 700;
}

/* txt-weight */
.txt-weight70{
font-weight: 700;
text-decoration: none;
}

/* txt-color */
.d-red{
color: #CB0000;
}

/* title */
.bd-title {
font-size: 120%;
padding: 0.6rem 1rem;
border-top: 1px solid rgba(255,35,35,0.70);
border-bottom: 1px solid rgba(255,35,35,0.70);
text-align: center;
}

/* txt-border */
.txt-border{
border-bottom: 2px #bbb solid;
padding-bottom: 14px;
}

.txt-border-red{
border-bottom: 3px #FF0004 solid;
padding-bottom: 14px;
}

/* bg */
.gly-bg3{
background-image: url("../images/line-bg1.png");
padding: 30px;
}
.gly-bg4{
background:rgba(238,238,238,0.90);
padding: 30px;
}
.gly-bg5{
background:rgba(238,238,238,0.90);
}
.gly-bg6{
background:rgba(128,124,124,0.30);
}
.grn-bg{
background:rgba(80,192,4,0.50);
padding: 12px 14px;
margin-bottom: 30px;
}
.grn-bg2{
background:#40903F;
}
.orn-bg{
background-image: url("../images/line-bg2.png");
padding: 30px 34px;
}
.orn-bg2{
background:#FF0000;
padding: 30px;
}
.orn-bg3{
background:rgba(255,82,84,0.30);
padding: 12px 14px;
margin-bottom: 30px;
}
.orn-bg4{
background:rgba(255,82,84,0.10);
padding: 16px 20px;
margin-bottom: 30px;
}
@media screen and (max-width: 1090px) {
.orn-bg4{
background:rgba(255,82,84,0.10);
padding: 16px 20px;
margin-bottom: 30px;
}
}
.orn-bg5{
background:rgba(255,82,84,0.10);
padding: 10px;
}

.orn-bg6{
background: #CBAA8A;
}

.wh-bg{
background:#FFF;
padding: 20px;
}
.wh-bg2{
background:#FFF;
padding: 20px;
height: 240px;
}
@media screen and (max-width: 1090px) {
.wh-bg2{
background:#FFF;
padding: 20px;
height: 260px;
}
}

.blk-bg{
background:#202020;
border: 1px 202020 solid;
border-radius: 6px;
margin-right: 3px;
padding: 6px;
color: #FFF;
}
@media screen and (max-width: 1090px) {
.blk-bg{
background:#202020;
border: 1px 202020 solid;
border-radius: 6px;
margin-right: 3px;
margin-bottom: 18px;
color: #FFF;
}
}

.red-waku-bg{
border: #FF0000 1px solid;
padding: 8px;
font-size: 120%;
font-weight: 600;
text-align: center;
color: rgba(255,0,0,1.00);
}

.blu-waku-bg{
border: rgba(206,206,248,1.00) 2px solid;
padding: 8px;
font-size: 100%;
}

.org-waku-bg{
border: rgba(255,82,84,0.60) 2px solid;
padding: 8px;
font-size: 100%;
}

.gly-waku-bg{
border: rgba(196,196,196,1.00) 1px solid;
padding: 8px;
background: #FFF;
}

.gly2-waku-bg{
border: rgba(196,196,196,1.00) 1px solid;
padding: 8px;
font-size: 110%;
font-weight: 600;
text-align: center;
width: 95.888%;
}

.yel-bg{
background:rgba(253,252,234,1.00);
padding: 20px;
}
@media screen and (max-width: 1090px) {
.yel-bg{
background:rgba(253,252,234,1.00);
padding: 20px;
}
}

.yel-bg2{
background:#FFF5E8;
padding: 30px;
}

.blu2-bg{
background:rgba(206,206,248,0.80);
padding: 12px 14px;
margin-bottom: 30px;
}

.blu3-bg{
background:rgba(206,206,248,0.20);
padding: 16px 20px;
margin-bottom: 30px;
}


/* white-tab */
.white-tab{
padding: 14px;
background: #FFF;
text-align: center;
font-weight: 600;
}
@media screen and (max-width: 780px) {
.white-tab{
padding: 6px;
background: #FFF;
text-align: center;
font-weight: 600;
font-size: 70%;
}
}

/* bottom-btn */
.bottom-btn {
padding: 40px 0;
max-width: 1240px;
display: block;
margin: 0 auto;
font-size: 14px;
line-height: 28px;
}

/* img */
.img80 {
width: 80%;
}
.img70 {
width: 70%;
}
.img67 {
width: 67%;
}
.img60 {
width: 60%;
}
.img50 {
width: 50%;
}
.img44 {
width: 44%;
}
.img42 {
width: 42%;
}
.img40 {
width: 40%;
}
.img34 {
width: 34%;
}
.img30 {
width: 30%;
}
.img25 {
width: 25%;
}
.img20 {
width: 20%;
}
.img10 {
width: 10%;
}
.img4 {
width: 4%;
}

.red-tab{
background: rgba(252,0,0,1.00);
display: block;
color: #FFF;
padding: 4px 6px;
margin-top:6px;
margin-bottom: 6px;
margin-left: 0px;
width: 120px;
text-align: center;
font-size: 80%;
}

.gly-tab{
border: 1px solid rgba(82,82,82,1.00);
display: inline;
padding: 3px 6px;
margin-top:6px;
margin-bottom: 6px;
margin-left: 0px;
width: 120px;
text-align: center;
font-size: 80%;
}

.grn-tab{
background: rgba(64,191,78,1.00);
color: #FFF;
display: block;
padding: 4px 6px;
margin-top:6px;
margin-bottom: 6px;
margin-left: 0px;
width: 120px;
text-align: center;
font-size: 80%;
}

.gly-bdr-tab{
border: 1px rgba(96,96,96,1.00) solid;
display: inline;
color: #FFF;
padding: 4px 6px;
margin-top:6px;
margin-bottom: 6px;
margin-left: 0px;
width: 120px;
text-align: center;
font-size: 80%;
background: rgba(86,86,86,1.00);
}

/* f-icon */
p.f-icon1{
position:relative;
line-height:2em;
text-indent:2.4em;
}
p.f-icon1:before{
position:absolute;
left:0;
content:"";
display:inline-block;
width:2em;
height:2.4em;
background:url(../images/foot-icon1.svg) no-repeat;
background-size:contain;
content:"";
display:inline-block;
width:2em;
height:2.4em;
}

p.f-icon2{
position:relative;
line-height:2em;
text-indent:3.4em;
}
p.f-icon2:before{
position:absolute;
left:0;
content:"";
display:inline-block;
width:2em;
height:3.4em;
background:url(../images/foot-icon2.svg) no-repeat;
background-size:contain;
content:"";
display:inline-block;
width:3em;
height:3em;
}

p.f-icon3{
position:relative;
line-height:2em;
text-indent:2.4em;
}
p.f-icon3:before{
position:absolute;
left:0;
content:"";
display:inline-block;
width:2em;
height:2.4em;
background:url(../images/foot-icon3.svg) no-repeat;
background-size:contain;
content:"";
display:inline-block;
width:2em;
height:2em;
}

/* hr */
hr.style1 {
border-top: 1px dashed rgba(197,197,197,1.00);
}


/* tooltip */
.tooltip{
position: relative;
cursor: pointer;
display: inline-block;
width: 160px;
text-decoration-line: underline;
}
.tooltip img{
display: inline;
vertical-align:middle;
margin-right: 6px;
}
.tooltip p{
margin:0;
padding:0;
font-size: 110%;
}
.description {
display: none;
position: absolute;
padding: 20px;
font-size: 12px;
line-height: 1.6em;
color: #333;
border-radius: 3px;
background:rgba(244,244,244,1.00);
border: 1px solid rgba(166,166,166,1.00);
width: 280px;
z-index: 1;
text-decoration-line: none;
}

.tooltip:hover .description{
display: inline-block;
top: 30px;
left: 20px;
}
/* tooltip */


/* tooltip2 */
.tooltip2 {
position: relative;
cursor: pointer;
display: inline-block;
text-decoration-line: underline;
}
.tooltip2 img{
display: inline;
vertical-align:middle;
margin-right: 6px;
}
.tooltip2 p{
margin:0;
padding:0;
font-size: 110%;
}
.description2 {
display: none;
position: absolute;
padding: 20px;
font-size: 12px;
line-height: 1.6em;
color: #333;
border-radius: 3px;
background:rgba(244,244,244,1.00);
border: 1px solid rgba(166,166,166,1.00);
width: 280px;
z-index: 1;
text-decoration-line: none;
}

.tooltip2:hover .description2{
display: inline-block;
top: 30px;
left: 20px;
}
/* tooltip2 */

/* head-bnrarea */
.head-bnrarea{
width: 100%;
height: 40px;
margin-bottom: 20px;
background-image:url(../images/header-bnrarea.svg);
background-repeat:repeat-x;
}
.head-bnrarea img {
width: 100%;
height: 40px;
padding: 0;
margin: 0;
}

/* table-scroll */
.table-scroll{
display: block;
overflow-x: scroll;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}













/* txt-color */
.red{
color: #FB0025;
}

.white{
color: #FFF;
}

.blu{
color: #0066C0;
}

.grn{
color: #40903F;
}

.chien{
color: #e3007f;
}


.magenta{
color: #009fe8;
}

.yellow{
color: #fff000;
}




/* txt-color */

/* img */
.img-center {
margin: 0 auto;
display: block;
}

/* txt-ul */
.txt-ul{
text-decoration: underline;
color: rgba(59,71,140,1.00);
}







/* cart-button */
.cart-button a {
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
padding: 6px 12px;
margin-bottom: 8px;
width: auto;
color: #FFF;
font-size: 15px;
font-weight: 600;
background-color: #d02d26;
box-shadow: 0 5px 0 #9a1f1a;
transition: 0.3s;
}

.cart-button a::after {
content: '';
width: 8px;
height: 8px;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
transform: rotate(45deg);
}

.cart-button a:hover {
transform: translateY(3px);
text-decoration: none;
box-shadow: 0 2px 0 #aaaaaa;
}





/* cart-button2 */
.cart-button2 a {
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
padding: 6px 12px;
margin-bottom: 8px;
width: 280px;
color: #FFF;
font-size: 15px;
font-weight: 600;
background-color: #d02d26;
box-shadow: 0 5px 0 #9a1f1a;
transition: 0.3s;
}

.cart-button2 a::after {
content: '';
width: 8px;
height: 8px;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
transform: rotate(45deg);
}

.cart-button2 a:hover {
transform: translateY(3px);
text-decoration: none;
box-shadow: 0 2px 0 #aaaaaa;
}






/* -------------------------------------------------------------------------------------------------------------*/





.tab_container {
padding-bottom: 1em;
margin: 0 auto;}
.tab_item {
width: calc(100%/3);
padding:20px 0 8px 0;
text-align: center;
color: #37beb0;
display: block;
float: left;
text-align: center;
font-size: 1.1rem;
font-weight: bold;
transition: all 0.2s ease;
background:rgba(159,222,229,0.20);
}
.tab_item:hover {
opacity: 0.75;
}
input[name="tab_item"] {
display: none;
}
.tab_content {
display: none;
padding: 1em 1em 0;
clear: both;
overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content {
display: block;
}
.tab_container input:checked + .tab_item {
background-color:rgba(148,206,214,0.40);
color: #FFF;
}

@media screen and (max-width: 680px) {
.tab_item {
font-size: 0.72rem;
}
}


.copyright {
font-size: 0.7rem;
text-align: center;
padding: 10px;
}



.hd-bg{
	background: rgba(51,105,126,1.00);
	color: #FFF;
	font-weight: 800;
	text-align: center;
	padding: 14px;
}