@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url("./modal_js.css"); /* モーダルの装飾css */

*, *::before, *::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* コーナータイトル非表示 */
#cookie_agree{width:100%;}
#corner_name .title,
#corner_main_text .title {
    display: none;
}

#corner_contents {
    width: 100%;
	background: #fff;

}

/*
#pagetop {
  bottom: 90px;
}
*/

/**------------------------------------------ modal --*/
span[data-modal] {
    position: relative;
}
span[data-modal]::after {
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 6px 8px;
    /*background: rgba(200, 230, 240, 0.5);
    border: 1px dashed #666;*/
    border-radius: 50%;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    content: "\f00e";
    font-size: 1.5em;
    background: rgba(255, 255, 255, 0.5);
    border: 1px dashed #666;
}


/**------------------------------------------ 商品サムネイル --*/
.item_wrap .mainImg {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 400px;
    width: 100%;
    margin: 20px auto;
    text-align: center;
}
.item_wrap .mainImg img {
    height: auto;
    max-height: 100%;
    width: auto;
    max-width: 100%;
    border-radius: 16px;
}

.item_wrap .subImg {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 10px;
}
.item_wrap .subImg li {
    width: 64px;
    height: 64px;
    text-align: center;
    margin-bottom: 5px;
    margin-right: 5px;
}
.item_wrap .subImg li img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
}

.item_info {
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0;
} 
.item_info dt{
    width: calc(22% - 5px);
    margin-bottom: 5px;
    text-align: center;
    color: #005cdf;
    border: 1px solid #005cdf;
    background: rgba(69,221,211,0.1);
}
.item_info dd {
    width: calc(78% - 5px);
    margin: 0 5px 5px;
}

.info_txt li { margin-bottom: 2px; }
.target_item { margin-bottom: 20px; }
p + .target_item { margin: -10px 5px 20px 10px; }
.target_item li a {
    text-decoration: none;
    border-bottom: 1px solid #d91c30;
}
.target_item li a:before {
    padding-right: 3px;
    padding-left: 3px;
    font-family: "Font Awesome 5 Free";
	content: "\f0da";
    color: #d91c30;
    font-weight: bold;
}
.attention_list {
    margin-top: 10px;
    margin-bottom: 0;
}
.attention_list li,
.attention_txt {
    display: block;
    margin-top: 3px;
    font-size: 0.73rem;
    text-indent: -1em;
    padding-left: 1em;
    line-height: 1.5em;
}
.attention_list li a,
.attention_txt a { color: #000; text-decoration: underline; }


/**-------------------------------------------- ヘッダー --*/
#corner_header {
    margin: 10px 0;
}
#corner_header a { text-decoration: underline; }
#corner_header p,
#corner_header ul {
    padding: 0 10px;
    margin-bottom: 0;
}

#corner_header .lead {
    text-align: center;
    font-size: 1.6rem;
    font-weight: bold;
    font-family: "Noto Serif JP",serif;
    color: #fff;
    text-shadow: 0 0 5px #3b97ff, 0 0 10px #3b97ff, 0 0 15px #3b97ff;
}
.end_of_sale {
    display: block;
    margin-top: 30px;
    width: auto;
    color: #f33;
    font-size: 1rem;
    text-align: center;
}

/**--------------------------------------- コンテナシステム --*/
.contents_wrap {
    position: relative;
    width: 100%;
}

.container-lg{
	width: auto;
	margin: 0 auto;
	padding: 1rem;
}

.container-md{
	width: 96%;
	margin: 0 auto;
	padding: 1rem 0;
}

.flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-self: stretch;
}

#breadcrumb li a {padding: 10px;} 

/**------------------------------------------- 商品 --*/
.item_list { margin-top: 20px; }
.item_list ul {
	margin: 0 -5px 0 10px;
    padding-top: 0px;
}
.item_list li {
    margin: 0;
    padding: 15px;
}
.corner_products ul li a {
    color: #666;
}
.header_title::first-line {
    font-size: 2em;
}
.header_title {
    margin: 20px 0 0;
    padding: 20px 0 40px;
    text-align: center;
    font-size: 1.2em;
    line-height: 1.5;
    border-bottom: 1px solid #fe8600;
}


/**-------------------------------------------- nav --*/
#corner_nav li {
    border-bottom: 1px solid #fff;
}
#corner_nav li a {
    position: relative;
    margin: 0;
    padding: 15px 0 15px 60px;
    text-align: left;
    font-size: 1.5em;
    background: #fe8600;
    color: #fff;
}

/**-------------------------------------------- nav --*/
#corner_nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

#corner_nav ul li {
    margin-bottom: 4px;
    padding: 0 2px;
    width: 50%;
}

#corner_nav ul li a {
    position: relative;
    padding: 15px 0;
    text-align: center;
    background: #333;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
}

#corner_nav li a::before, .btn::before {
    position: absolute;
    left: 20px;
    font-family: "Font Awesome 5 free";
    font-size: 1.2em;
    content: "\f101";
}

/**---------------------------------------- ボタン設定 --*/
.btn {
    position: relative;
    display: block;
    padding: 12px 0 10px;
    text-align: center;
    transition: 0.3s;
    font-weight: bold;
    font-size: 1.2em;
    border-radius: 8px;
    text-decoration: none;
    margin: auto;
	margin-top: 1em;
    margin-bottom: 1em;
	width: 90%;
	font-size: 1em;
}

.btn:hover {
    text-decoration: none;
}


a.btn-gradation {
    background-image: radial-gradient(circle at 100% 0%, rgba(243, 152, 0, 0.95) 15%, rgba(230, 0, 18, 1));
    color: #FFFFFF;
    border: 0px !important;
}

a.btn-white {
    background: #FFFFFF;
    color: #fe8600;
    border: 2px #CCC solid !important;
}

a.btn-orange {
    position: relative;
    background: radial-gradient(circle at 100% 0%, rgba(243, 152, 0, 0.95) 15%, rgba(230, 0, 18, 1));
    color: #fff;
    font-size: 1.1rem;
    border: 3px solid #fd0d0d;
    border-radius: 40px;
    box-shadow: 0px 5px 15px -5px rgb(21 33 35 / 80%);
}
a.btn-orange::before {
    position: absolute;
    left: 20px;
    font-family: "Font Awesome 5 free";
    font-size: 1.2em;
    content: "\f07a";
}

a.btn-gray {
    color: #333;
    background: #eee;
    border: 2px #CCC solid !important;
}

a.btn-black {
    color: #FFFFFF;
    background: #333;
    border: 2px #333 solid !important;
}

.btn-shadow {
    transition: box-shadow 0.3s;
    box-shadow: 0 2.5rem 2rem -2rem hsl(200deg 50% 20% / 40%);
}

.btn-shadow:hover {
    box-shadow: 0 0 0 0 hsl(200deg 50% 20% / 40%);
}

.btn-float {
    position:relative;
    top:0;
    transition: all .3s;
}

.btn-float:hover {
    top: -5px;
    box-shadow: 0 5px 6px rgba(0, 0, 0, 0.3);
    opacity: 1;
}

/* twitter鳥アイコン時代 */
.btn-Twitter::before {
    position: absolute;
    left: 20px;
    font-family: "Font Awesome 5 Brands"!important;
    font-size: 1.2em;
    content: "\f099"!important;
}

/* X時代 */

.btn-x::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    top: 13px;
    left: 15px;
    background-image: url(../images/logo-black.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}


/* SP横スクロールボタン設定 */
.horizontal_scroll {
  overflow-x: scroll;
  -webkit-overflow-scrolling: touch;
  padding: 12px 0 12px 8px;
  display: -ms-flexbox;
  display: flex;
}

.horizontal_scroll li{
	position: relative; 
}

.horizontal_scroll > li {
  width: 100%;
  min-width: 80px;
}


.horizontal_scroll > li:not(:last-child) {
  margin-right: 5px;
}


.horizontal_scroll img {
  vertical-align: bottom;
}


@media screen and (min-width: 711px) {
	.horizontal_scroll {
	overflow-x: inherit;
	padding: 0 8px 6px;
	}
	.horizontal_scroll > li {
	min-width: inherit;
	}

	.horizontal_scroll > li:last-child {
	padding-right: 0;
	}
	
	span[data-modal]::after {
	background: rgba(255, 255, 255, 0.5);
    border: 1px dashed #666;
	}
	
}


.horizontal_scroll::-webkit-scrollbar {
    width: 16px;
	height: 4px;
}
 
.horizontal_scroll::-webkit-scrollbar-track {
    background-color: rgba(24, 90, 133, 0.1);
    border-radius: 100px;
}
 
.horizontal_scroll::-webkit-scrollbar-thumb {
    background: rgba(24, 90, 133, 0.3);
    border-radius: 100px;
}

.i_hot{
    position: absolute;
    right: -2px;
    width: 22px;
    height: 21px;
    border-radius: 50%;
	background-image: radial-gradient(circle at 100% 0%, rgba(243, 152, 0, 0.95) 15%, rgba(230, 0, 18, 1));
    color: white;
    font-size: 0.5rem;
    text-align: center;
	font-weight: bold;
}

/* 縮小なしボタンリスト */
.category_link_box {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.category_link_box li{
	text-align: center;
}


/**----------------------------------------- 見出し --*/

h1.h1_title {
	position: relative;
    margin: 20px auto 40px;
    text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
}

h1.h1_title:after {
	content: "";
	position: absolute;
	bottom: -16px;
	display: inline-block;
	width: 30px;
	height: 5px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #fe8600;
	border-radius: 2px;
}

h2 {
    position: relative;
    color: #333;
    background: transparent;
    font-size: 1.2rem;
    z-index: 1;
    line-height: 120%;
    margin: 0;
}


h3.corner_h3{
	font-size: 1.4em;
    padding: .8rem 0;
    border-bottom: 0;
    font-weight: bold;
	line-height: 1.6em;
}

h4{
	font-size: 1em;
	font-weight: bold;
	margin: 1rem 0;
}

h5{
    position: relative;
    color: #333;
    background: transparent;
    font-size: 1.6em;
    z-index: 1;
    line-height: 140%;
	margin-top: 0;
}

h6{
	position: relative;
	margin: .4rem 0 3rem;
	text-align: center;
}
h6:after {
	content: "";
	position: absolute;
	bottom: -16px;
	display: inline-block;
	width: 30px;
	height: 5px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	background-color: #fe8600;
	border-radius: 2px;
}


.sale-end h4,.sale-end p{
	font-size: .8rem;
}

/**----------------------------------------- ゲマくじ概要 --*/
.con_flex {
	margin: 0 auto;
    width: auto;
}

.con_wrap {
	width: auto;
	margin: 0 5px 20px;
}

.con_m {
    position: relative;
	padding: 0 0 0 45px;
	margin: 5px;
	font-weight: bold;
	font-size: 1rem;
	color: #333333;
}

.awe:before {
	position: absolute;
	left: 15px;
	font-family: "Font Awesome 5 free";
	font-size: 1.2em;
}

.calendar:before {
	content: "\f073";
}

.coin:before {
	content: "\f51e";
}

.calendar:before {
	content: "\f073";
}

.car:before {
	content: "\f0d1";
}

.credit:before {
	content: "\f09d";
}

.image:before {
	content: "\f03e";
}


.con_p {
	padding: 0 0 0 20px;
	font-weight: bold;
}

.con_wrap ul {
	padding: 0 20px;
}

.con_wrap ul li{
	
}



/**------------------------------------- テキストリンク設定 --*/ 
.text-box a{
    text-decoration: underline;
    color: #fe8600;
    border: 0px !important;
}

div.text-box a:hover{
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

/**------------------------------------- テキスト装飾 部分強調 --*/ 
.text-color-primary{
	color: #fe8600;
}

.text-color-white{
	color: #ffffff;
}

.fw-bold{
	font-weight: bold;
}
.text-white{
	color: #FFFFFF;
}

.text-orange {
	color: #fe8600;
}

.period {
    display: inline-block;
    width: auto;
    background: rgba(24, 90, 133, 0.1);
    padding: 0 4px;
}

/**------------------------------------- ボーダー設定 --*/ 
.boder{
	border: 1px solid #ccc;
}


/**------------------------------------- カード設定 --*/ 
.card{
	border: 1px solid #ccc;
	background: #FFFFFF;
	border-radius: 8px;
}

.card-body{
	margin: 0 auto;
}

.card-color-white{
	border: solid 2px #FFF;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.5);
}
/**------------------------------------- 注釈 --*/ 
.annotation_box {
    max-width: 700px;
    padding: .8rem;
    background: rgba(24, 90, 133, 0.1);
    margin: 0 auto;
}

/**------------------------------------- 情報エリア --*/
.sub_text { margin-bottom: 20px; }

.probability {
    width: 136px;
    padding: 5px 0;
    margin: 20px 10px;
    text-align: center;
    background: #eee;
    border: 1px solid #ccc;
}
.probability strong {
    padding-left: 5px;
    font-size: 1rem;
}

.prize_spec { margin: 20px 10px; }
.prize_pickup {
    display: block;
    margin: 4px 0;
    padding-bottom: 1px;
    text-align: center;
    font-size: 0.7rem;
    line-height: 160%;
    color: #fff;
    background: #B60A05;
    border-radius: 20px;
}
.prize_num {
    width: 100%;
    display: block;
    padding-bottom: 2px;
    text-align: center;
    color: #fff;
    /*background: #77B3D0;*/
}

.prize_info {
    position: relative;
    margin-bottom: 30px;
}
/*
.prize_img::after,
.tokuten .info_img::after {
    position: absolute;
    right: 6%;
    bottom: 2%;
    padding: 6px 8px;
    background: rgba(239, 239, 239, 0.5);
    border: 1px dashed #666;
    border-radius: 50%;
    font-family: "Font Awesome 5 Free";
    font-weight: bold;
    content: "\f00e";
    font-size: 1.5em;
}
*/

.info_wrap { width: 100%; }
.info_box dl {
    padding: 5px;
    background: #fff;
}
.info_box dt {
    margin: 0 4px;
    text-align: left;
    color: #333;
    border-bottom: 1px solid #ccc;
}
.info_box dd {
    margin: 0 4px;
    padding-bottom: 4px;
}
.info_box .info_tit {
    margin-bottom: 5px;
    padding: 0;
    font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    color: #000;
    line-height: 1.3;
}
.info_img {
    position: relative;
    text-align: center;
}


	
/**------------------------------------- ゲマくじ景品詳細 --*/
.prize_flex {
	display: flex;
    flex-wrap: wrap;
    width: auto;
    margin: 0 auto;
    padding: 0;
    align-items: center;
    align-content: center;
}

.prize_img {
	width: 30%;
    text-align: left;
    padding: 0;
}
.prize_img img {
	width: auto;
    padding: 5px;
}

.prize_title {
	width: 70%;
    padding-top: 0%;
}

.prize_title p.percent {
	margin: 0 10px;
    width: 40%;
    padding: 5px;
    text-align: center;
    font-size: 0.8rem;
}

.small {
	font-size: 1rem;
    margin-left: 10px;
}

.info_box {
	width: auto;
    margin: 0 auto;
    padding: 10px 10px;
}
	
.info_box p {
	text-align: center;
	background: #fff6db;
	padding: 10px;
	font-size: 0.8rem;
	font-weight: bold;
}

p.size_p{
	margin: 0 0 0 20px;
}

.prize_item {
	max-width: 1000px;
	display: flex;
	flex-wrap: wrap;
	width: auto;
	margin: 0 auto;
	padding-bottom: 0;
}

.prize_item p {
	width: calc(100% / 2 - 8px);
    margin: 10px 4px;
    font-weight: bold;
    background: #fff;
    box-shadow: 0 0 4px 1px rgba(0, 0, 0, 0.1);
}


.prize_num {
	width: auto;
	display: inline-block;
	margin-right: 6px;
	padding: 0 8px 2px;
	color: #333;
	font-weight: bold;
	/*
	background: #fe8600;
	*/
}

/**------------------------------------- ゲマくじ特典 --*/

.special_flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: auto;
	margin: 0 auto;
	padding: 15px 15px 0;
	align-items: center;
	align-content: center;
}

.tokuten_wrap {
	margin: 0 auto;
	padding: 50px 0 100px;
	width: 1080px;
}

.tokuten_name {
	margin: 50px auto 0;
	text-align: center;
	font-weight: bold;
	font-size: 1.2rem;
}

.special_img {
	width: 30%;
	text-align: right;
	padding-right: 10px;
}
	
.special_img img {
}

.tokuten_title {
    
}

.tokuten_flex{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin: 15px;
}

.tokuten_img {
	margin: 0;
    text-align: center;
    flex-basis: auto;
}

.tokuten_img img {
	
}

.tokuten_txt {
	margin: 0;
	background: #fff;
	padding: 0;
	flex-basis: auto;
}

.tokuten_txt p {
	text-align: center;
    font-size: .8rem;
    margin-top: 15px;
    padding: 0 15px;
    font-weight: bold;
}

.tokuten_txt dl {
	display: flex;
	flex-wrap: wrap;
	width: auto;
	margin: 15px 0 0;
}

.tokuten_txt dl dt {
	margin: 0 0 .5rem 0;
	flex-basis: 20%;
	text-align: center;
	font-weight: bold;
	color: #333333;
}

.tokuten_txt dl dd {
	flex-basis: 80%;
	margin: 0 0 .5rem 0;
}

 .white_wid {
	width: auto;
	margin: 0 10px;
	/*
	border: 3px solid #ffbb7f;
	*/
}



/**------------------------------------- ゲマくじWチャンス --*/

p.w_m {
	font-size: 1rem;
	color: #fff;
	background: linear-gradient(58deg, rgba(234, 148, 30, 1) 0%, rgba(215, 22, 24, 1) 100%);
	width: 65%;
	font-weight: bold;
	padding: 2px 13px 0px;
}

p.txt_s {
	font-size: 0.8rem;
	text-align: center;
}

/**------------------------------------- ゲマくじ店舗販売 --*/

.tenpo a{
	text-decoration: underline;
    color: #5e68e5;
    font-weight: bold;
}


/*ニュー情報エリア*/
dl {
display: flex;
flex-flow: row wrap;
max-width: 700px;
	margin: auto;
}
dt {
	flex-basis: 20%;
	padding: .25rem .5rem;
	background-color: rgba(24, 90, 133, 0.1);
	margin: 0 0 .25rem 0;
}
dd {
	flex-basis: 80%;
	padding: .25rem .5rem;
	background-color: #fff;
	margin: 0 0 .25rem 0;
}
@media screen and (max-width: 559px) {
dl {
flex-flow: column;
}
}

table{
  border-collapse: collapse;
  width: 100%;
}
.tb01 th,
.tb01 td{
  padding: 8px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
}
.tb01 th {
  background: rgba(24, 90, 133, 0.1);

  
}
@media screen and (max-width: 640px) {
  .tb01 .head{
    display:none;
  }
  .tb01 {
    width: 100%;
  }
  .tb01 td,
  .tb01 th{
    display: block;
    width: 100%;
    border-bottom:none;
  }
  .tb01 td{
    padding: 8px;
    display: block;
    width: 100%;
    line-height: 1.6;
    text-align:left;
  }
  .tb01 td:before{
    content: attr(data-label);
    font-weight: bold;
    display: inline;
    margin-right: 4px;
    float: left;
	width: 25%;
  }
  .tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }
}


/**------------------------------------------- カテゴリーボタン --*/

.category_link_circle{
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.category_link_circle li{
	width: auto;
	border-radius: 200px;
	padding: .4rem;
	margin: .4rem;
}


/** howto **/
.howto {
	/* Used to position the left vertical line */
	position: relative;
	max-width: 675px;
    margin: 0 auto;
}

.howto__line {
	/* Border */
	border-right: 4px solid #EAF6DC;
	left: 40px;
	position: absolute;
	top: 0px;
	height: 80%;
	z-index: 10;
}

.howto__items {
	/* Reset styles */
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

.howto__item {
	margin-bottom: 8px;
}

.howto__top {
	/* Center the content horizontally */
	align-items: center;
	display: flex;
}

.howto__circle {
	/* Rounded border */
	background-color: #EAF6DC;
	border-radius: 9999px;
	z-index: 20;
	/* Size */
	height: 80px;
	width: 80px;
}

.howto__title {

	flex: 1;
}

.howto__h3{
	font-size: 16px;
	padding-left: 24px;
}

.howto__desc {
	margin-left: 104px;
}


/**-------------------------------------- copyright --*/
.copyright { padding: 30px 0 20px; }
.copyright .attention {
    margin: 20px;
    font-size: 0.87em;
    line-height: 1.5em;
    text-align: left;
}

/**------------------------------ PC(幅1080px以上のスタイル) -*/
@media screen and (min-width: 1080px) {
	 /* コンテナ設定 */
	.container-lg{
		width: 1080px;
		margin: 0 auto;
		padding: 3rem 0;
	}
	
}


/**-------------------------------------------------- PC(幅711px以上のスタイル) -*/
@media screen and (min-width: 711px) {
    
    
    body { 
        box-sizing: border-box;
    }
    #corner_contents .main_contents {
        width: 100%;
    }
    .corner_products/*,
    section div.text*/ {
        width: 1080px;
        margin: 0 auto;
    }
    /* clearfix */
    section div.text::after,
    dl::after,
    .info_box::after,
    .info_box dd::after {
        display: block;
        clear: both;
        content: "";
    }
	
	.container-md{
	width: 700px;
	padding: 3rem 0;
	}
	
    /**------------------------------------------- 商品 --*/

	.item_list { width: 1080px; margin: 20px auto;}
    .item_list ul {
	margin: 0;
        background: transparent;
	justify-content: center;

    }
    .item_list ul li {
        margin: 0 15px 40px;
        padding: 0;
    }
    .item_list ul li a {
        background: #fff;
    }
	


    /**--------------------------------------- ヘッダー --*/
    /*#corner_main_banner { display: none; }*/
    .header_title {
        font-size: 1.5em;
    }
    
    /**-------------------------------------------- nav --*/
    #corner_nav {
        background: transparent;
    }
    #corner_nav ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        max-width: 1080px;
        margin: 0 auto;
    }
    #corner_nav li {
        position: relative;
        width: calc( 100% / 5 );
        border: none;
    }
    #corner_nav li::before {
        content: "";
        position: absolute;
        top: 31%;
        left: 0;
        display: inline-block;
        width: 1px;
        height: 20px;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        background-color: #aaa;
    }
    #corner_nav li:first-child::before { width: 0; }
    #corner_nav li a {
        padding: 20px 0;
        text-align: center;
        background: transparent;
        color: #fe8600;
    }
    #corner_nav li a::before { content: ""; }

    .container-md{
	width: 700px;
	padding: 3rem 0;
	}
	
	/**-------------------------------------- ボタン設定 --*/
	.btn-pc {
    	width: 640px;
	}
	
	.btn {
	font-size: 16px;
	}

	/**----------------------------------------- 見出し --*/
	
	h1.h1_title {
		position: relative;
		margin: 40px auto 60px;
		text-align: center;
		font-size: 1.5rem;
		font-weight: bold;
	}
    
	h1.h1_title:after {
		content: "";
		position: absolute;
		bottom: -30px;
		display: inline-block;
		width: 30px;
		height: 5px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #fe8600;
		border-radius: 2px;
	}
	
	h2 {
    	position: relative;
    	background: transparent;
    	font-size: 1.8rem;
    	z-index: 1;
    	line-height: 140%;
	}


	h3{
	    position: relative;
		font-size: 2em;
    	padding: .8rem 0;
    	border-bottom: 0;
    	font-weight: bold;
		line-height: 1.6em;
		text-align: center;
	}
	
	h3:after {
		content: "";
		position: absolute;
		bottom: -10px;
		display: inline-block;
		width: 30px;
		height: 5px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #fe8600;
		border-radius: 2px;
	}



	h4{
	    position: relative;
		font-size: 1.4em;
		font-weight: bold;
		margin: 1rem 0;
	}
	
	/*
	h4:after {
		content: "";
		position: absolute;
		bottom: -10px;
		display: inline-block;
		width: 30px;
		height: 5px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #fe8600;
		border-radius: 2px;
	}
	*/

	h5{
		position: relative;
		color: #333;
		background: transparent;
		font-size: 1.8rem;
		z-index: 1;
		line-height: 140%;
		margin-top: 0;
	}

	h6{
		position: relative;
		font-size: 1.4em;
		font-weight: bold;
		margin: .4rem 0 3rem;
        text-align: center;
	}
	
	h6:after {
		content: "";
		position: absolute;
		bottom: -20px;
		display: inline-block;
		width: 30px;
		height: 5px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		background-color: #fe8600;
		border-radius: 2px;
	}
	
	
	/**----------------------------------------- ゲマくじ概要 --*/
	.con_flex {
		margin: 0 auto;
		padding-left: 80px;
		display: flex;
		flex-wrap: wrap;
		justify-content: left;
		width: 1080px;
	}
	
	.con_wrap {
		width: 45%;
		margin: 5px;
	}
	
	.con_m {
		padding: 3px 0 3px 50px;
		margin: 0 5px 10px;
		font-size: 1rem;
	}
	
	.con_p {
		padding: 0px 0 0 20px;
		font-weight: bold;
	}
	
	.con_wrap ul {
		padding: 0 0 0 20px;
	}
	
	.con_wrap ul li{
		
	}
	
	
    /**------------------------------------- ゲマくじ景品詳細 --*/
    .prize_flex {
		display: flex;
		flex-wrap: wrap;
		width: auto;
		margin: 0 0 0 10px;
		padding: 0;
		align-items: center;
		align-content: center;
	}
	
	.prize_img {
		width: 20%;
		text-align: right;
		padding-right: 20px;
	}
	.prize_img img {
		width: 85%;
	}
	
	.prize_title {
		width: 70%;
		padding-top: 3%;
	}
	
	.prize_title p.percent {
		margin: 0px 10px 0 10px;
		width: 17%;
		font-size: 1rem;
	}
	
	.small {
		font-size: 1.5rem;
		margin-left: 10px;
	}
	
	.info_box {
		width: 1000px;
		margin: 30px auto 0;
		padding: 0 4px;
	}
	
	.info_box p {
		text-align: center;
		padding: 10px;
		font-size: 1rem;
		font-weight: bold;
	}
	
	p.size_p{
		margin: 10px 0 0 60px;
	}
	
	.prize_item {
		width: 100%;
		margin: 30px auto 0;
		padding-bottom: 50px;
	}
	
	.prize_item p {
		width: calc(100% / 4 - 8px);
		margin: 10px 4px;
		background: #fff;
	}
	

	.prize_num {

	}
	
	
	
    /**------------------------------------- ゲマくじ特典 --*/
	
	.special_flex {
		display: flex;
		flex-wrap: wrap;
		justify-content: left;
		width: auto;
		margin: 0 auto;
		padding: 30px 0 0 50px;
		align-items: center;
		align-content: center;
	}
	
	.tokuten_wrap {
		margin: 0 auto;
		padding: 50px 0 100px;
		width: 1080px;
	}
	
	.tokuten_name {
		margin: 50px auto 0;
		text-align: center;
		font-weight: bold;
		font-size: 1.2rem;
	}
	
	.special_img {
	    width: 17%;
        text-align: right;
        padding-right: 20px;
	}
	
	.special_img img {
	}
	
	.tokuten_title {
	    
	}
	
	.tokuten_flex{
	    display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        margin: 20px 20px 30px;
        padding-bottom: 30px;
	}
	

	
	
	.tokuten_img {
        margin: 0 0 0 13px;
        text-align: center;
        flex-basis: 45%;
	}
	
	.tokuten_img img {
		
	}
	
	.tokuten_txt {
        margin: 0;
        background: #fff;
        padding: 0;
        flex-basis: 45%;
	}
	
	.tokuten_txt p {
		text-align: left;
		font-size: 0.95rem;
        font-weight: bold;
        margin: 0 auto;
        padding: 0px 0px 0 30px;
	}
	
	.tokuten_txt dl {
		display: flex;
		flex-wrap: wrap;
		width: 450px;
		margin: 15px 0;
		padding-left: 30px;
	}
	
	.tokuten_txt dl dt {
	
	}
	
	.tokuten_txt dl dd {
		flex-basis: 80%;
		margin: 0 0 .5rem 0;
	}
	
	 .white_wid {
	    width: 900px;
        margin: 0 auto;
        /*
        border: 3px solid #ffbb7f;
        */
	}
	
	
	
    /**------------------------------------- ゲマくじWチャンス --*/
	
	p.w_m {
	    font-size: 1.1rem;
        color: #fff;
        background: linear-gradient(58deg, rgba(234, 148, 30, 1) 0%, rgba(215, 22, 24, 1) 100%);
        width: 50%;
        font-weight: bold;
        padding: 2px 13px 0px;
	}
	
	p.txt_s {
	    font-size: 0.8rem;
	}


}
	
    /**------------------------------------- 共通 --*/
    div.text p { font-size: 1.1em; }
    
    .text.about { text-align: center; }

    /** ゲーマーズの特徴 **/
    .feature {
        display: flex;
        flex-wrap: wrap;
        justify-content:center;
    }
    .feature dl {
        width: 480px;
        margin: 20px;
    }
    .feature dd p {
        padding: 4px 8px;
    }
    .feature_desc {
        display: flex;
        flex-wrap: wrap;
        width: 960px;
    }
    .feature_desc dt {
        width: 320px;
    }
    .feature_desc dd {
        width: calc(100% - 320px);
    }
    .feature_img {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto;

    }

    .payment_list {
        padding: 0.5em 1em 0.5em 2.3em;
        position: relative;
    }
    .payment_list .payment_item {
        line-height: 1.5;
        padding: 0.5em 0;
        font-weight: bold;
    }
    .payment_list .payment_item::before {
        font-family: "Font Awesome 5 Free";
        content: "\f00c";
        position: absolute;
        left : 1em;
        color: #ffb03f;
        font-weight: bold;
    }
    .img_list {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
		margin-bottom: 10px;
    }
    .img_list img {
        max-width: 120px;
        max-height: 32px;
        margin: 0 4px;
    }

    /** バナーリンク **/
   .banner_link2 li {
    margin-bottom: 10px;
    padding: 0 4px;
    width: 50%;
}

    
    /** おすすめ商品 **/
    .banner_link li {
        width: auto;
    }
	
	
	    /**------------------------------------- くじ --*/
    .line_up_list {
        justify-content: center;
        margin-top: 20px;
    }
    .line_up_list li { width: auto; }
    .line_up_list li a {
        width: 200px;
        padding: 10px 10px 20px;
        font-size: 1rem;
    }
    .line_up_list li a::after {
        position: absolute;
        right: 0;
        left: 0;
        bottom: 0;
        font-family: "Font Awesome 5 Free";
        font-weight: bold;
        content: "\f0d7";
    }
    
    .line_up_list li a,
    .kuji_info a,
    .kuji_info a::before,
    .kuji_info a::after {
        text-decoration: none;
        opacity: 1;
        transition: .3s;
    }
    
    .kuji_info { padding: 0; }
    .kuji_info a:hover { border: 3px solid #eef7f9; }
    .kuji_info a:hover::before { border-color: transparent transparent #eef7f9; }
    .kuji_info a:hover::after { color: #fe8600; }
    
    .kuji_info a p { padding: 0 10px 5px; }
    
    .now_on_sale,
    .coming_soon { width: 900px; }
    
    .now_on_sale h4,
    .coming_soon h4 { padding: 10px 10px 5px;font-size: 1rem; }
    
    .now_on_sale a,
    .coming_soon a {
        width: calc(50% - 5px);
        margin-right: 10px;
    }
    .now_on_sale a p,
    .coming_soon a p { font-size: 0.9rem; }
    .now_on_sale a:nth-child(even),
    .coming_soon a:nth-child(even) { margin-right: 0; }
    
    .end_of_sale h4 { padding: 5px 10px; }
    .end_of_sale { 
        margin: 0 auto;
    }
    .end_of_sale a { width: calc(25% - 8px); }
    .end_of_sale a:nth-child(odd) { margin-right: 8px; }
    .end_of_sale a:nth-child(4n+2) { margin-right: 8px; }
    
    /**-------------------------------------- copyright --*/
    .copyright { margin: 0 0 40px; }
    .copyright a:hover { text-decoration: none; }
    .copyright .attention { text-align: center; }
    .link_btn {
        width: 70%;
        margin: 0 auto;
        padding: 30px 0;
        display:flex;
    }


    .link_btn p {
        margin-bottom: 10px;
        color: #333;
        font-weight: bold;
        font-size: 1rem;
    }
    .link_btn_left {
        width: 50%;
        margin-right: 5px;
        background: #fff;
    }

    .link_btn_right {
        width: 50%;
        margin-left: 5px;
        background: #fff;
    }


    .link_btn_left a, .link_btn_right a {
        display: block;
        max-width: 480px;
        text-align: center;
        font-size: 1rem;
    }
    .link_btn_left a {
        
    }

    .link_btn_right a {
        
    }

    .link_btn_left img{
        margin: 0 auto;
        width: 30%;
    }
	

}/**------------------------------------- PCここまで --*/




/*! Flickity　スライドショー設定
---------------------------------------------- */

.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus { outline: none; }

.flickity-viewport {
  /*overflow: hidden;*/
  position: relative;
  height: 100%;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */

.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- flickity-button ---- */

.flickity-button {
  position: absolute;
  background: hsla(0, 0%, 100%, 0.75);
  border: none;
  color: #333;
}

.flickity-button:hover {
  background: white;
  cursor: pointer;
}

.flickity-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #19F;
}

.flickity-button:active {
  opacity: 0.6;
}

.flickity-button:disabled {
  opacity: 0.3;
  cursor: auto;
  /* prevent disabled button from capturing pointer up event. #716 */
  pointer-events: none;
}

.flickity-button-icon {
  fill: currentColor;
}

/* ---- previous/next buttons ---- */

.flickity-prev-next-button {
  top: 50%;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  /* vertically center */
  transform: translateY(-50%);
}

.flickity-prev-next-button.previous { left: 10px; }
.flickity-prev-next-button.next { right: 10px; }
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px;
}

.flickity-prev-next-button .flickity-button-icon {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%;
}

/* ---- page dots ---- */

.flickity-page-dots {
  position: absolute;
  width: 100%;
  top: 13%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}

.flickity-rtl .flickity-page-dots { direction: rtl; }

.flickity-page-dots .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  background: #333;
  border-radius: 50%;
  opacity: 0.25;
  cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
  opacity: 1;
}
	
.gallery {
  padding: 10px 0;
}

n.gallery-cell {
  width: 66%;
  height: 200px;
  margin-right: 10px;
  background: #FFFFFF;
  counter-increment: gallery-cell;
}

/* external css: flickity.css */

* {
  box-sizing: border-box;
}

.Container {
  max-width: 800px;
  margin: 0 auto;
}

body {
  font-family: sans-serif;
}

.carousel_1,.carousel_2 {
  background: #fafafa;
}

.carousel_1 {
  margin-bottom: 15%;
}

.carousel_2 {
  margin-bottom: 40px;
}


.carousel-cell {
  width: 100%;
  height: 200px;
  margin-right: 10px;
  background: #fff;
  border-radius: 5px;
  counter-increment: carousel-cell;
}

/* cell number */
.carousel-cell:before {
  display: block;
  text-align: center;
  content: counter(carousel-cell);
  line-height: 200px;
  font-size: 80px;
  color: white;
}

.carousel-nav .carousel-cell {
  height: 80px;
  width: 100px;
}

.carousel-nav .carousel-cell:before {
  font-size: 50px;
  line-height: 80px;
}

.carousel-nav .carousel-cell.is-nav-selected {
  background: #ed2;
}


@media screen and (min-width: 641px) {
	.gallery-cell {
		width: 800px;
		height: 420px;
		margin-right: 10px;
		background: #FFFFFF;
		counter-increment: gallery-cell;
}
}



.slide_b{
  position: absolute;
  top: 0;
  left: 40%;
  width: 25%;
}



.slide_s{
  position: absolute;
  top: 0;
}



/**------------------------------------- ポップアップ --*/

/* ポップアップの基本スタイル */

.popup {
  display: none; /* 初期状態では非表示 */
  position: fixed; /* 常に表示させるために固定ポジション */
  z-index: 100; /* 他の要素より前面に表示 */
  left: 0;
  top: 0;
  width: 100%; /* 画面全体に広がる */
  height: 100%; /* 画面全体に広がる */
  overflow: auto; /* スクロール可能 */
  background-color: rgba(0,0,0,0.4); /* 透明度を持つ黒 */
}

/* ポップアップのコンテンツのスタイル */

.popup-content {
  background-color: #fefefe;
  margin: 15% auto; 
  padding: 20px;
  border: 1px solid #888;
  width: 80%; 
}

/* 閉じるボタンのスタイル */

.popup-close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}
.popup-close:hover,
.popup-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}


/* ポップアップフローティングバー */

#floating-bar {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 10%;
  background-color: #fe8600;
  padding: 10px 0;
  color: #fff;
  text-align: center;
  z-index: 1000;
  display: none; /* デフォルトは非表示 */
}

#end {
  height: 0; /* フッターの高さは本当のケースによる */
  background: #fff;
}


/* ポップアップスライドイン */

.slidein-popup {
  opacity: 0;
  position: fixed;
  bottom: 0;
  right: 0px;
  transition: all 1s ease;
  transform: translateX(100%);
  background-color: rgb(247 221 127 / 90%);
  border: none;
  width: 100%;
  height: auto;
  color: #333;
  padding: 5px;
  border-radius: 0;
  box-shadow: none;
  z-index: 2;
}

.slidein-popup.active {
 opacity: 1;
 transform: translateX(0);
}

@media screen and (min-width: 711px) {
	.slidein-popup {
		opacity: 0;
		position: fixed;
		bottom: 100px;
		right: 20px;
		transition: all 1s ease;
		transform: translateX(100%);
		background-color: #fff;
		border: 3px solid #fe8600;
		width: 280px;
		height: auto;
		color: #333;
		padding: 10px;
		border-radius: 5px;
		box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
		z-index: 1;
	}

	.slidein-popup.active {
		opacity: 1;
		transform: translateX(0);
	}
}

/* ポップアップスライドイン中身文字のみ */

.slide_txt {
    
}

.slide_txt p {
    text-align: center;
}

.slide_big {
    
}

.before {
    
}

.slide_flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

.txt_bg {
    width: 50%;
    margin: 0 0 0 5px;
    background: #fff;
    padding: 2px 0;
    border: 2px solid #ffbb7f;
    color: #fe8600;
    font-weight: bold;
    border-radius: 21px;
}

.slide_prize {
    font-size: 1rem;
}


@media screen and (min-width: 711px) {
    .slide_txt {
        
    }

    .slide_txt p {
        text-align: center;
    }
    
    .slide_txt a {
        padding-left: 35px;
    }

    .slide_big {
        
    }
    
    .before {
        background: #e1dfdf;
        padding: 8px;
        width: 90%;
        margin: 0 auto;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: bold;
    }
    
    .slide_flex {
        
    }
    
    .txt_bg {
        display: none;
    }
    
    .slide_prize {
        font-size: 1.2rem;
    }
}


/* ポップアップスライドイン中身画像用 */

.slide_img {
    
}

.slide_img p {
    text-align: center;
}

.slide_img a {
    padding-left: 0;
}

.slide_img a img {
    display: none;
}

.slide_big {
    
}

.before {
    
}

.slide_prize {
   
}


@media screen and (min-width: 711px) {
    .slide_img {
        
    }

    .slide_img p {
        text-align: center;
    }
    
    .slide_img a {
        padding-left: 0;
    }
    
    .slide_img a img {
        display: block;
        width: 60%;
        margin: 10px auto 0;
    }

    .slide_big {
        
    }
    
    .before {
        background: #e1dfdf;
        padding: 8px;
        width: 90%;
        margin: 10px auto;
        border-radius: 8px;
        font-size: 1rem;
        font-weight: bold;
    }
    .slide_prize {
        font-size: 1.2rem;
    }
}


/**--------------------------------------- 背景色設定 --*/
.bg-green {
    background: #EAF6DC;
}

.bg-gray {
    background: #F0F3F5;
}

.bg-white {
    background: #FFFFFF;
}

.bg-black {
    background: #333333;
}

.bg-gradation {
    background: -moz-linear-gradient(65deg, #E60012, #F39800);
    background: -webkit-linear-gradient(65deg, #E60012, #F39800);
    background: linear-gradient(25deg, #E60012, #F39800);
}

.bg-primary{
	background: url("../images/bg-spade.png" ),#EFF4FF;
	padding: 50px 0;
}

.bg-gradation-majikoi{
	
	background:
              linear-gradient( to bottom, rgba(126,206,244,1), #fff );
}

.bg-gradation-campaign{
	background-color: #FA8BFF;
	background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);
}

.bg-tokuten {
    background: url(../images/bg-spade.png), #ffe8ce;
}

.bg-wchance {
    background: url(../images/bg-spade.png), #ffe1da;
}

.bg-Transg {
    background: rgba(24, 90, 133, 0.1);
}

.max_1080 {
    max-width: 1080px;
    margin: 0 auto;
}

/**-------------------------------------- 角丸設定 --*/
.rounded{
	border-radius: 4px;
}

.rounded-circle{
	width: auto;
    border-radius: 200px;
    padding: 0.2rem;
}

/**------------------------------------- スマホだけbr --*/

/*PCでは無効（改行しない）*/
.show-xs{
    display: none;
}

/*スマートフォンでは有効（改行する）*/
@media screen and (max-width:559px) {
    .show-xs{
        display: block;
    }
}

/**------------------------------------- PCだけbr --*/

/*spでは無効（改行しない）*/
.show-pc{
    display: block;
}

/*pcでは有効（改行する）*/
@media screen and (max-width:559px) {
    .show-pc{
        display: none;
    }
}


/**-------------------------------------- 余白設定 --*/
.p-1{
	padding: .25rem;
}

.p-2{
	padding: .5rem;
}

.p-3{
	padding: 1rem;
}

.p-4{
	padding: 1.5rem;
}
.p-5{
	padding: 2rem;
}


.px-1{
	padding: 0 .25rem;
}

.px-2{
	padding: 0 .5rem;
}

.px-3{
	padding: 0 1rem;
}

.px-4{
	padding: 0 1.5rem;
}

.px-5{
	padding: 0 2rem;
}


.py-1{
	padding: .25rem 0;
}

.py-2{
	padding: .5rem 0;
}

.py-3{
	padding: 1rem 0;
}

.py-4{
	padding: 1.5rem 0;
}

.py-5{
	padding: 2rem 0;
}

.pt-1{
	padding-top: .25rem;
}

.pt-2{
	padding-top: .5rem;
}
.pt-3{
	padding-top: 1rem;
}

.pt-4{
	padding-top: 1.5rem;
}

.pt-5{
	padding-top: 2rem;
}

.pb-1{padding-bottom: .25rem;
}

.pb-2{padding-bottom: .5rem;
}

.pb-3{padding-bottom: 1rem;
}

.pb-4{padding-bottom: 1.5rem;
}
.pb-5{padding-bottom: 2rem;
}

.mb-1{
	margin-bottom: .25rem;
}

.mb-2{
	margin-bottom: .5rem;
}

.mb-3{
	margin-bottom: 1rem;
}

.mb-4{
	margin-bottom: 1.5rem;
}

.mb-5{
	margin-bottom: 2rem;
}
.mt-1{
	margin-top: .25rem;
}

.mt-2{
	margin-top: .5rem;
}

.mt-3{
	margin-top: 1rem;
}

.mt-4{
	margin-top: 1.5rem;
}

.mt-5{
	margin-top: 2rem;
}

.mr-1{
	margin-right: .25rem;
}

.mr-2{
	margin-right: .5rem;
}

.mr-3{
	margin-right: 1rem;
}

.mr-4{
	margin-right: 1.5rem;
}

.mr-5{
	margin-right: 2rem;
}


.my-1{
	padding: .25rem 0;
}

.my-2{
	padding: .5rem 0;
}

.my-3{
	padding: 1rem 0;
}

.my-4{
	padding: 1.5rem 0;
}

.my-5{
	padding: 2rem 0;
}

.mx-1{
	padding: 0 .25rem;
}

.mx-2{
	padding: 0 .5rem;
}

.mx-3{
	padding: 0 1rem;
}

.mx-4{
	padding: 0 1.5rem;
}

.mx-5{
	padding: 0 2rem;
}


/**--------------------------------------- グリッドシステム --*/

	.col-2 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-3 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-4 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-5 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-6 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-7 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-8 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-9 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-10 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-11 {
		flex: 0 0 auto;
		width: 100%;
	}

	.col-12 {
		flex: 0 0 auto;
		width: 100%;
	}

@media screen and (min-width: 711px) {
	.col-2 {
		flex: 0 0 auto;
		width: 16.66666666%;
	}

	.col-3 {
		flex: 0 0 auto;
		width: 24.99999999%;
	}

	.col-4 {
		flex: 0 0 auto;
		width: 33.33333333%;
	}

	.col-5 {
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-6 {
		flex: 0 0 auto;
		width: 50%;
	}

	.col-7 {
		flex: 0 0 auto;
		width: 58.33333333%;
	}

	.col-8 {
		flex: 0 0 auto;
		width: 66.66666667%;
	}

	.col-9 {
		flex: 0 0 auto;
		width: 74.99999999%;
	}

	.col-10 {
		flex: 0 0 auto;
		width: 83.33333333%;
	}

	.col-11 {
		flex: 0 0 auto;
		width: 91.66666666%;
	}

	.col-12 {
		flex: 0 0 auto;
		width: 100%;
	}
}


@media screen and (max-width: 711px) {
	.col-sm-6{
		flex: 0 0 auto;
		width: 50%;
	}
	.col-sm-4{
		flex: 0 0 auto;
		width: 33.33333333%;
	}
	.col-sm-3{
		flex: 0 0 auto;
		width: 24.99999999%;
	}
	

}