#hbg {
    position : absolute;
	width : calc(50% + 27%);
	height : 600px;
	border-bottom-right-radius : 20px;
	top : 0;
	left : 0;
	z-index : 1;
    background:
    radial-gradient(circle at 80% 80%, rgba(207,238,224,0.6) 0%, transparent 50%),
    radial-gradient(circle at 30% 80%, rgba(223,245,234,0.5) 0%, transparent 50%),
    radial-gradient(circle at 20% 60%, rgba(255,241,204,0.6) 0%, transparent 50%),
    radial-gradient(circle at 70% 20%, rgba(255,232,163,0.6) 0%, transparent 50%),
    radial-gradient(circle at 25% 25%, rgba(255,244,204,0.6) 0%, transparent 50%),
    #fffdf7;
}

dl#hcopy {
    width : 80%;
    margin : 0 auto 6% auto;
}

dl#hcopy h2 {
    font-size : 150%;
    line-height : 1.25em;
    color : #4b6e69;
}

dl#hcopy h2 span {
    display : block;
    margin : 0 7% 4% 7%;
    padding : 5px 0 7px 0;
    font-size : 66%;
    color : #ffffff;
    background : #7dc31e;
    text-align : center;
    border-radius : 36px;
}

dl#hcopy dd {
    display : none;
}

/*----------SEARCHTAB----------*/

#searchtab {
	width : 90%;
    margin : 0 auto 0 auto;
}

.tab-group {
    display : flex;
    justify-content : center;
	font-size : 110%;
	font-weight : 600;
}

.tab {
    flex-grow : 1;
    padding : 13px 0 15px 0;
    color : #ffffff;
    background : #50ad9b;
    list-style : none;
    text-align : center;
    cursor : pointer;
}

.tab:first-child {
	border-top-left-radius : 10px;
}

.tab:last-child {
	border-top-right-radius : 10px;
    border-right : solid 1px #d7d7d7;
}

.tab.is-active {
    color : #50ad9b;
    background : #ffffff;
    transition : all 0.2s ease-out;
}

.tab.is-active:first-child {
    border-top : solid 1px #c8c8c8;
    border-left : solid 1px #c8c8c8;
}

.tab.is-active:last-child {
    border-top : solid 1px #c8c8c8;
    border-right : solid 1px #c8c8c8;
}

.panel {
    display : none;
}

.panel.is-show {
    display : block;
	position : relative;
	padding : 10px 10px 8px 10px;
	background : #ffffff;
    border-left : solid 1px #c8c8c8;
	border-bottom-left-radius : 10px;
	border-bottom-right-radius : 10px;
    border-right : solid 1px #d7d7d7;
    border-bottom : solid 1px #d7d7d7;
}

ul.tnavi {
	list-style : none;
	overflow : hidden;
	width : 100%;
    font-size : 120%;
    font-weight : 600;
}

ul.tnavi li {
	float : left;
	width : 49.5%;
	margin : 0 1% 1% 0;
}

ul.tnavi li:nth-child(2n) {
	margin : 0 0 1% 0;
}

ul.tnavi li a {
	display : block;
	padding : 17px 0 20px 17px;
    color : #69968d;
    background-color : #f0f5dc;
    background-image : url(../common/tnarrow1.svg);
    background-repeat : no-repeat;
    background-size : 30px;
    background-position : top 18px right 11px;
    text-decoration : none;
}

ul.tnavi li font {
    letter-spacing : -3px;
}

/*----------NEWS----------*/

#news {
    width : 90%;
    margin : 0 auto 4% auto;
    padding-top : 2%;
}

#news h2 {
    margin-bottom : 4%;
    color : #ff9132;
	font-size : 300%;
	font-family : "bebas-neue",sans-serif;
	font-weight : 400;
	font-style : normal;
    line-height : 0.75em;
	letter-spacing : 4px;
}

#news h2 span {
    margin-left : 5px;
	font-family : "Noto Sans JP","sans-serif";
	font-style : normal;
	font-weight : 600;
	font-size : 32%;
	color : #666666;
    letter-spacing : 0;
    vertical-align : 3px;
}

#news ul {
    list-style : none;
    overflow : hidden;
    width : 100%;
    margin : 0;
    font-size : 90%;
}

#news ul li {
    width : 100%;
    padding : 9px 0 11px 0;
    border-top : solid 1px #c8c8c8;
}

#news ul li:nth-child(2n) {
    margin : 0;
}

#news ul li span {
    display : block;
    margin-bottom : 3px;
    color : #50ad9b;
    font-weight : 600;
    letter-spacing : 1px;
}

#news ul li dl dd {
    color : #a0a0a0;
}

#news ul li dl dd a {
	color : #2d8778;
	text-decoration : underline;
}

/*----------RECOMMEND----------*/

#recommend {
    width : 100%;
    padding : 9% 0 8% 0;
    background : linear-gradient(to bottom,#e6f2ce 50%,#d7e8b8 100%);
}

#recommend h2 {
    width : 90%;
    margin : 0 auto 5% auto;
    color : #7dc31e;
	font-size : 250%;
	font-family : "bebas-neue",sans-serif;
	font-weight : 400;
	font-style : normal;
    letter-spacing : 3px;
    line-height : 0.8em;
}

#recommend h2 span {
    display : block;
	font-family : "Noto Sans JP","sans-serif";
	font-style : normal;
	font-weight : 600;
	font-size : 40%;
	color : #93a36c;
    letter-spacing : 0;
}

ul#pList {
    list-style : none;
    overflow : hidden;
    width : 100%;
    border-top : solid 1px #c8c8c8;
}

ul#pList li {
    position : relative;
    padding : 5% 4% 5% 4%;
    background : #ffffff;
    border-bottom : solid 1px #c8c8c8;
}

ul#pList li a {
    display : block;
    width : 100%;
    color : #3c3c3c;
    text-decoration : none;
}

p[class^="label"] {
    position : absolute;
    width : 100px;
    padding : 6px 0 7px 0;
    color : #ffffff;
    font-size : 80%;
    font-weight : 600;
    text-align : center;
    border-top-left-radius : 7px;
    border-bottom-right-radius : 8px;
    top : 10%;
    left : 4%;
    z-index : 1;
}

p.label01 {
    background : #0066cc;
} 

p.label02 {
    background : #eb7305;
} 

p.label03 {
    background : #4bb996;
}

p.label04 {
    background : #785af0;
}

p.label05 {
    background : #f55f7d;
}

.thumnail {
	width : 40%;
	background-size : cover;
	background-position : center center;
	padding-top : 155px;
    border-radius : 5px;
}

ul#pList li div {
    position : absolute;
    width : 50%;
    top : 9%;
    right : 4%;
}

ul#pList li h3 {
    display : -webkit-box;
	-webkit-box-orient : vertical;
	-webkit-line-clamp : 2;
    overflow : hidden;
    margin-bottom : 12px;
    font-weight : 600;
    font-size : 110%;
    line-height : 1.4em;
    top : 0;
    right : 0;
}

p.price {
    color : #e83018;
    font-size : 110%;
    font-weight : 600;
    line-height : 1.5em;
}

p.price font {
    margin-right : 3px;
    font-size : 180%;
	font-family : "bebas-neue",sans-serif;
	font-weight : 400;
	font-style : normal;
    letter-spacing : 1px;
    vertical-align : -1px;
}

p.price span {
    color : #3c3c3c;
    font-size : 80%;
	font-style : normal;
    font-weight : 400;
}

p.price em {
    color : #0f75bd;
    font-size : 110%;
    font-style : normal;
    line-height : 1.4em;
}

p.parea span {
    display : none;
}

p.vdetail {
    position : absolute;
    width : 48%;
    padding : 4px 0 6px 0;
    font-size : 86%;
    font-weight : 600;
    text-align : center;
    color : #6b572f;
    background : #f4e692;
    border-radius : 30px;
    right : 6%;
    bottom : 10%;
}

/*----------SUPPORT----------*/

#support {
    margin-bottom : 8%;
    padding : 9% 5% 6% 5%;
    background : #f0f5dc;
}

#support h2 {
    margin-bottom : 5%;
    color : #69968d;
	font-size : 250%;
	font-family : "bebas-neue",sans-serif;
	font-weight : 400;
	font-style : normal;
    letter-spacing : 3px;
    line-height : 0.8em;
}

#support h2 span {
    display : block;
	font-family : "Noto Sans JP","sans-serif";
	font-style : normal;
	font-weight : 600;
	font-size : 40%;
	color : #9da386;
    letter-spacing : 0;
}

ul#movies {
	list-style : none;
	overflow : hidden;
    margin-bottom : 3%;
}

ul#movies li {
	float : left;
    overflow : hidden;
	width : 49%;
	margin-right : 2%;
    background : #ffffff;
    border-radius : 8px;
}

ul#movies li a {
    display : block;
    color : #3c3c3c;
    text-decoration : none;
}

.thumbnail2 {
	width : 100%;
	background-size : cover;
	background-position : center center;
	padding-top : 150px;
    border-top-left-radius : 8px;
    border-top-right-radius : 8px;
}

ul#movies li dl {
    margin : 10% 8% 10% 8%;
}

ul#movies li dl dt {
    margin-bottom : 7%;
	font-size : 110%;
	font-weight : 600;
	color : #282828;
	text-align : center;
}

ul#movies li dl dd {
    font-size : 88%;
    line-height : 1.4em;
}

/*----------ABOUT----------*/

#about {
    width : 90%;
    margin : 0 auto 8% auto;
}

#about dl {
    width : 96%;
    margin : 0 auto 8% auto;
}

#about dl dt {
    margin-bottom : 6%;
    color : #50ad9b;
    font-size : 110%;
    font-weight : 600;
}

#about dl dd {
    line-height : 1.5em;
}

#data {
	width : 100%;
    margin-bottom : 7%;
	border-top : solid 1px #c8c8c8;
    line-height : 1.4em;
}

#data th {
	width : 84px !important;
	width /**/: 110px;
	padding : 11px 13px 12px 13px;
	border-bottom : solid 1px #c8c8c8;
	background : #ecede6;
	text-align : left;
	font-weight : 400;
}

#data td {
	padding : 11px 0 12px 15px;
	border-bottom : solid 1px #c8c8c8;
}

/*----------MODAL----------*/

.modal {
    display : none;
    height : 100%;
    position : fixed;
    top : 0;
	left : 0;
    width : 100%;
	z-index : 9999;
}

.modal__bg {
    background : rgba(223,245,234,0.9);
    height : 100%;
	position : fixed;
	top : 0;
	left : 0;
    width : 100%;
	z-index : 9999;
}

.modal__content {
	position: absolute;
	top : 50%;
	left : 50%;
	-webkit-transform : translate(-50%,-50%);
	-moz-transform : translate(-50%,-50%);
	-ms-transform : translate(-50%,-50%);
	-o-transform : translate(-50%,-50%);
	transform : translate(-50%,-50%);
	text-align : center;
	width : 86%;
    padding : 6% 6% 8% 6%;
    background : #ffffff;
    box-sizing : border-box;
    border-radius : 12px;
	z-index : 9999;
}

.modal__content p {
    margin-bottom : 5%;
    line-height : 1.5em;
    text-align : left;
}

a.js-modal-close {
    padding : 6px 25px 8px 25px;
    color : #ffffff;
    background : #ff9132;
    font-size : 90%;
    font-weight : 600;
    border-radius : 36px;
    text-decoration : none;
	cursor: pointer;
}
