@import url(https://use.fontawesome.com/releases/v5.0.6/css/all.css);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);


/*====================================================================
ベース
====================================================================*/

.quicksand{
font-family: 'Quicksand', sans-serif;
}

a {
outline: 0;
border: none;
text-decoration: none;
}

a:focus, a:hover, a:active {
outline: 0;
color: #999caa!important;
text-decoration: none;
}


.link {
position: relative;
font-size: 13px;
font-weight: 600;
font-family: Hind, sans-serif;
}

.link:after {
position: absolute;
top: 8px;
right: -15px;
width: 9px;
height: 2px;
background: #17d29f!important;
content: " ";
}

.link_btn,
.link_btn_w{
width: 150px;
height: 40px;
margin: 0 auto;
}

.link_btn a,
.link_btn_w a{
display: block;
font-size: 12px;
font-family: 'Quicksand', sans-serif;
width: 100%;
height: 100%;
color: #333333!important;
text-align: center;
box-sizing: border-box;
line-height: 1;
letter-spacing: 3px;
padding: 14px 0;
border-radius: 4px;		/* CSS3草案 */
-webkit-border-radius: 4px;	/* Safari,Google Chrome用 */
-moz-border-radius: 4px;	/* Firefox用 */
}

.link_btn a{
background-color:#f2f2f2!important;
}
.link_btn_w a{
background-color:#fff!important;
}



h1 > a:focus, h2 > a:focus, h3 > a:focus, h4 > a:focus, h5 > a:focus, h6 > a:focus {
text-decoration: none;
}

* a:hover{
opacity:0.5;
filter: alpha(opacity=50);        /* ie lt 8 */
-ms-filter: "alpha(opacity=50)";  /* ie 8 */
-moz-opacity:0.5;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 0.5;              /* Safari 1.x */
}


a.no:hover{
opacity:1;
filter: alpha(opacity=100);        /* ie lt 8 */
-ms-filter: "alpha(opacity=100)";  /* ie 8 */
-moz-opacity:1;                 /* FF lt 1.5, Netscape */
-khtml-opacity: 1;              /* Safari 1.x */
}

.object-fit-img {
object-fit: cover;
object-position: center;
font-family: 'object-fit: cover; object-position: center;'
}

/*-------------Content----------------*/
.container {
width: 100%;
margin-right: auto;
margin-left: auto;
max-width: 1280px;
position: relative;
}

.content_inner {
width: 90%;
margin: 0 auto;
}


.content {
padding-top: 40px;
padding-bottom: 40px;
}

.content-sm {
padding-top: 60px;
padding-bottom: 60px;
}

.content-md {
padding-top: 80px;
padding-bottom: 80px;
}

.content-lg {
padding-top: 100px;
padding-bottom: 100px;
}

.bg-color-sky-light {
background: #f2f2f2!important;
}

/*---------------改行------------------*/

.br::before {
content: "\A" ;
white-space: pre ;
}
.br_sp::before {
content: "" ;
white-space:normal;
}
.br_sp768::before {
content: "" ;
white-space:normal;
}
.br_sp480::before {
content: "" ;
white-space:normal;
}
.txt{
text-align: center;
}

@media screen and (max-width: 992px){
.br_sp::before {
content: "\A" ;
white-space: pre ;
}
}

@media screen and (max-width: 768px) {
.br::before {
content: "" ;
white-space:normal;
}
.txt{
text-align: left;
}
.br_sp768::before {
content: "\A" ;
white-space: pre ;
}
}

@media screen and (max-width: 480px){
.br_sp480::before {
content: "\A" ;
white-space: pre ;
}
}

/*---------色------------*/
.color-base {
color: #515769!important;
}
.WHITE{
color: #fff!important;
}

/*========================================================
メニュー
========================================================*/



#REGISTRY,
#INQUIRY{
position: absolute;
margin: 0 auto;
top:0;
bottom:auto;
width: 170px;
height: 100px;
}

#REGISTRY{
left:auto;
right: 0;
}

#INQUIRY{
left:auto;
/* right: 171px; */
right: 0;
}

#REGISTRY a,
#INQUIRY a{
width: 100%;
height: 100%;
display: block;
background-color:#fff!important;
position: relative;
}

#REGISTRY a::before,
#INQUIRY a::before{
position: absolute;
top:30%;
bottom:auto;
width: 100%;
text-align: center;
font-family: 'Quicksand', sans-serif;
font-size:12px;
letter-spacing: 3px;
color: #333333!important;
}
#REGISTRY a::before{
content: 'REGISTRY';
}
#INQUIRY a::before{
content: 'INQUIRY';
}
#REGISTRY a::after,
#INQUIRY a::after{
position: absolute;
font-size:10px;
bottom:30%;
top:auto;
width: 100%;
text-align: center;
color: #333333!important;
}
#REGISTRY a::after{
content: '会員登録';
}
#INQUIRY a::after{
content: 'お問い合わせ';
}

#MENU{
width: 100%;
height: 50px;
background-color:#fff;
box-sizing: border-box;
display: block;
position: relative;
}

.header #MENU nav{
width: auto;
margin:auto;
height: 100%;
display: flex;
justify-content: flex-end;

}
.header #MENU nav > ul{
height: 100%;
display:-webkit-inline-flex;
display:-moz-inline-flex;
display: inline-flex;
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;
}
.header #MENU nav > ul > li{
box-sizing: border-box;
text-align: center;
font-size:16px;
font-weight: 700;
line-height: 1;
color: #fff;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-align:center;
-moz-box-align:center;
-ms-flex-align:center;
-webkit-align-items:center;
-moz-align-items:center;
align-items:center;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex-positive: 1;
    -webkit-flex: 1 1 auto;
    -moz-flex: 1 1 auto;
    flex: 1 1 auto;
}
.header #MENU nav > ul > li:not(:last-of-type){
  margin-right: 4em;
}
@media only screen and (max-width: 480px) {
  .header #MENU nav > ul > li:not(:last-of-type){
  margin-right: 0em;
  }
}
.header #MENU nav > ul > li > a{
    color: #000!important;
    transition-duration: 300ms;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
    height: 100%;
    width: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -webkit-flex-pack: center;
    -moz-flex-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    justify-content: center;
    box-sizing: border-box;
}

header nav > ul > li > a:hover{
}
header nav > ul > li > a.current{
color:#99a3be!important;
}
#MENU li a.active{
	padding: 13px 0;
}

.openMenu,
.openMenu.closeMenu{
display:none;
z-index: 1000;
}

@media (max-width: 992px) {
header h1{
/*display: none;*/
}

#REGISTRY,
#INQUIRY{
width: 60px;
height: 40px;
top: 30px;
bottom:auto;
}

#REGISTRY{
right: 40px;
}

#INQUIRY{
right: 100px;
}

#REGISTRY a,
#INQUIRY a{
background-color:inherit;
}

#REGISTRY a::before,
#INQUIRY a::before{
font-family: FontAwesome;
}
#REGISTRY a::before{
content: '\f007';
top:0;
font-size:20px;
}
#INQUIRY a::before{
content: '\f0e0';
top:3px;
font-size:16px;
}
#REGISTRY a::after,
#INQUIRY a::after{
bottom:0;
letter-spacing: -0.05em;
}
#REGISTRY a::after{
content: '会員登録';
}
#INQUIRY a::after{
content: 'お問い合わせ';
}

#MENU{
height: auto;
padding: 0;
margin: 0;
display: none;
position: absolute;
z-index: 999;
top:100px;
}

header nav{
height: auto;
}

header nav > ul{
height: 100%;
margin: 0;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}
header nav > ul > li{
width:100%;
border-bottom: 1px solid RGBA(255,255,255,0.2)!important;
}
header nav > ul > li:last-child{
border-bottom: none!important;
}
header nav > ul > li > a{
padding: 20px 0;
-webkit-box-pack:left;
-moz-box-pack:left;
-webkit-flex-pack:left;
-moz-flex-pack:left;
-ms-flex-pack:left;
-webkit-justify-content:left;
-moz-justify-content:left;
justify-content:left;
}


.openMenu,
.openMenu.closeMenu{
position:absolute;
top:35px;
right:10px;
bottom:auto;
left:auto;
margin: auto;
height:25px;
width: 25px;
display:block;
}
.openMenu div,
.openMenu.closeMenu div {
position: relative;
width: 90%;
height: 11px;
margin: 7px auto;
box-sizing: border-box;
border-bottom: 1px solid #515769;
cursor: pointer;
transition-duration: 300ms;
transition-property: all;
transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}
.openMenu div:hover,
.openMenu.closeMenu div:hover {
border-bottom: 1px solid #17bed2;
}
.openMenu div::before,
.openMenu div::after{
position: absolute;
content: '';
height: 1px;
margin: auto;
bottom:auto;
left:0;
right: auto;
border-top: 1px solid #515769;
transition-duration: 300ms;
transition-property: all;
transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}
.openMenu div::before{
width: 75%;
top: 50%;
}
.openMenu div::after{
width: 50%;
top: 0;
}

.openMenu.closeMenu div::before{
position: absolute;
content: '';
width: 100%;
height: 1px;
margin: auto;
bottom:auto;
left:0;
right: auto;
border-top: 1px solid #515769;
}
.openMenu.closeMenu div::before{
top: 50%;
}
.openMenu.closeMenu div::after{
width: 100%;
}

.openMenu.closeMenu div:hover::before,
.openMenu div:hover::before{
border-top: 1px solid #e34b8b;
}
.openMenu.closeMenu div:hover::after,
.openMenu div:hover::after{
border-top: 1px solid #17d29f;
}
}

@media only screen and (max-width: 480px) {
#Hind, sans-serif {
    width: 120px;
    margin: 0 0 0 10px;
    height: 30px;
    padding: 10px 0 30px 0;
}

#MENU{
  top: 0;
  width: 100vw;
  height: 40vh;
  left: 0;
  padding: 4%;
  padding-top: 20%;
}

#REGISTRY,
#INQUIRY{
top: 20px;
}
.openMenu,
.openMenu.closeMenu{
top:25px;
}

nav > ul > li{
width:50%;
}
}



/*========================================================
contact
========================================================*/
#contact{
background-color:#f2f2f2!important;
}

#contact .col03 > ul:last-child > li{
padding: 5%;
}

#contact .col02 > ul > li{
margin: 20px 2% 0 2%;
width: 180px;
}

#contact .col02 > ul > li a{
display: block;
font-size: 10px;
width: 100%;
height: 100%;
color: #000!important;
background-color:#448158!important;
text-align: center;
box-sizing: border-box;
line-height: 1.5em;
padding: 14px 0;
border-radius: 4px;		/* CSS3草案 */
-webkit-border-radius: 4px;	/* Safari,Google Chrome用 */
-moz-border-radius: 4px;	/* Firefox用 */
}


.contact-list > li {
font-size: 13px;
color: #81848f!important;
margin-bottom: 5px;
}
.map{
height: 300px;
}


@media only screen and (max-width: 480px) {
.address{
width: 100%;
}
}

/*========================================================
フッター
========================================================*/

/*　　フッター　*/
.footer {
background-color:#ededed;
text-align: center;
}
.footer > img {
width: 100%;
height: 12.666666%;
}

.footer .col02{
}

.footer .col02 > ul > li{
margin: 0 2% 20px 2%;
width: 180px;
}

.footer .col02 > ul > li a{
display: block;
font-size: 10px;
width: 100%;
height: 100%;
color: #333333!important;
background-color:#fff!important;
text-align: center;
box-sizing: border-box;
line-height: 1.5em;
letter-spacing: 3px;
padding: 14px 0;
border-radius: 4px;		/* CSS3草案 */
-webkit-border-radius: 4px;	/* Safari,Google Chrome用 */
-moz-border-radius: 4px;	/* Firefox用 */
}
.footer .LOGO{
  text-align: center;
}
.footer .LOGO img{
  max-width: 200px;
  margin-inline: auto;
}
@media screen and (max-width: 960px){
.footer .LOGO img{
  max-width: 30%;
  margin-inline: auto;
}
}
.footer .LOGO a{
  max-width: 50%;
  width: auto;
  margin-inline: auto;
  display: inline-block;
}
#COPY{
padding: 40px 0;
font-size: 1.4rem;
font-weight: bold;
}

@media screen and (max-width: 992px){
.footer > img {
width: 100%;
height: 150px;
}
}
@media screen and (max-width: 480px){
.footer .col02{
margin: 40px 0;
}

.footer > img {
width: 100%;
height: 95px;
}

#COPY{
padding: 20px 0;
}
}
/*========================================================
PAGE
========================================================*/
.pagetop {
position: fixed;
right: 0;
bottom: 10px;
z-index: 8888;
width: 45px;
height: 45px;
font-size: 11px;
font-weight: 700;
font-family: Hind;
text-align: center;
letter-spacing: 1;
line-height: 45px;
background: #515769;
opacity: 0.4;
border-radius: 3px 0 0 3px;
transition-duration: 300ms;
transition-property: all;
transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}
.pagetop:hover {
opacity: 1;
}
.pagetop a{
color: #fff!important;
height: 100%;
width: 100%;
}

/*========================================================
PAGE
========================================================*/

/*　　ページタイトル　*/
#TITLE{
width: 100%;
height: 100px;
position: relative;
text-align: center;
margin-bottom: 80px;
letter-spacing: 3px;
}
#TITLE span{
font-size:48px;
font-family: 'Quicksand', sans-serif;
padding: 0 0 0 3px;
}
#TITLE span:last-child{
font-size:12px;
font-family: "Sawarabi Gothic";
color: #99a3be!important;
}

#TITLE::before{
content: "";
position: absolute;
width: 40px;
height: 1px;
border-bottom: 2px solid #99a3be;
top:auto;
bottom:0;
left:0;
right: 0;
margin: auto;
}

@media screen and (max-width: 480px) {
	
#TITLE{
height: 80px;
margin-bottom: 50px;
}	

#TITLE span{
	font-size:32px;}	
	
}


.lead_txt{
font-size:12px;
}


.tit {
position: relative;
padding: 0 0 15px 0;
margin: 0 auto 20px auto;
text-align: center;
}
.tit:after {
position: absolute;
content: '';
width: 40px;
height: 1px;
line-height: 1;
margin: auto;
top: auto;
bottom: 0;
left: 0;
right: 0;
border-bottom: 1px solid #000;
}

/*番号付ボックス*/

.nunber{
width: 100%;
height: auto;
padding: 60px 0 0 0;
position: relative;
z-index: 1;
}

.nunber::before{
position: absolute;
width: 50px;
height: 50px;
border-radius: 50%;
border: 3px solid #ccc;
font-size:40px;
color: #ccc!important;
font-weight: 700;
margin: auto;
top:0;
bottom:auto;
left:0;
right: 0;
text-align: center;
}
.nunber.number_01::before{
content: "1";
}
.nunber.number_02::before{
content: "2";
}
.nunber.number_03::before{
content: "3";
}
.nunber.number_04::before{
content: "4";
}
.nunber.number_05::before{
content: "5";
}
.nunber.number_06::before{
content: "6";
}
.nunber.number_07::before{
content: "7";
}
.nunber.number_08::before{
content: "8";
}

/*テーブル*/
.table{
width: 100%;
box-sizing: border-box;
}

ul.list_number{
list-style-type: decimal;
}
ul.list_square{
list-style: square;
}

ul.list_square li,
ul.list_number li{
margin: 0 0 5px 15px;
}

/*============================
画像
============================*/
.photo{
    overflow: hidden;
	width: 100%;
	position: relative;
}
.photo5{padding: 5% 0 0 0;}
.photo9{padding: 9% 0 0 0;}
.photo10{padding: 10% 0 0 0;}
.photo20{padding: 20% 0 0 0;}
.photo30{padding: 30% 0 0 0;}
.photo40{padding: 40% 0 0 0;}
.photo50{padding: 50% 0 0 0;}
.photo60{padding: 60% 0 0 0;}
.photo70{padding: 70% 0 0 0;}
.photo80{padding: 80% 0 0 0;}
.photo90{padding: 90% 0 0 0;}
.photo100{padding: 100% 0 0 0;}
.photo110{padding: 110% 0 0 0;}
.photo120{padding: 120% 0 0 0;}
.photo130{padding: 130% 0 0 0;}
.photo140{padding: 150% 0 0 0;}

.photo > div{
position: absolute;
top:0;
bottom:0;
left:0;
right: 0;
}

.photo > div > img{
width: 100%;
height: 100%;
}

img.po_btm{
object-position: 50% 100%
}

.tit_border_g{
border-bottom: 1px solid #448158;
padding: 0 0 10px 0;
}
.tit_border_b{
border-bottom: 1px solid #333;
padding: 0 0 10px 0;
}

/*============================
ボタン
============================*/
.btn_col04 > ul,
.btn_col03 > ul{
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-pack:start;
-moz-box-pack:start;
-webkit-flex-pack:start;
-moz-flex-pack:start;
-ms-flex-pack:start;
-webkit-justify-content:flex-start;
-moz-justify-content:flex-start;
justify-content:flex-start;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
-webkit-box-pack:center;
-moz-box-pack:center;
-webkit-flex-pack:center;
-moz-flex-pack:center;
-ms-flex-pack:center;
-webkit-justify-content:center;
-moz-justify-content:center;
justify-content:center;
}

.btn_col04 > ul > li{
width: 23%;
margin: 0 1% 2% 1%;
}
.btn_col03 > ul > li{
width: 31%;
margin: 0 1% 2% 1%;
}


.btn_col04 > ul > li a,
.btn_col03 > ul > li a{
display: block;
font-size: 12px;
width: 100%;
height: 100%;
color: #333333!important;
background-color:#f2f2f2!important;
text-align: center;
box-sizing: border-box;
line-height: 1;
padding: 10% 5px 10% 30px;
border-radius: 4px;		/* CSS3草案 */
-webkit-border-radius: 4px;	/* Safari,Google Chrome用 */
-moz-border-radius: 4px;	/* Firefox用 */
position:relative;
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-align:center;
-moz-box-align:center;
-ms-flex-align:center;
-webkit-align-items:center;
-moz-align-items:center;
align-items:center;
}
.btn_col04 > ul > li a::before,
.btn_col03 > ul > li a::before{
position:absolute;
font-family: "Font Awesome 5 Free";
content: '\f35a';
line-height: 1;
width: 14px;
height: 14px;
font-size:14px;
top:0;
bottom:0;
left:10px;
right: auto;
margin: auto;
color: #333!important;
}


@media only screen and (max-width: 768px) {
.btn_col04 > ul > li,
.btn_col03 > ul > li{
width: 48%;
text-align: left;
}
}

@media only screen and (max-width: 480px) {
.btn_col04 > ul > li a,
.btn_col03 > ul > li a{
font-size:10px;
}
}

/*============================
列配置
============================*/

/**　1列　**/

.col01{
position: relative;
width: 100%;
padding-top: 40%;
}


/**　2列　**/

.col02 > ul,
.col03 > ul,
.col04 > ul,
.col05 > ul{
display:-webkit-box;
display:-moz-box;
display:-ms-flexbox;
display:-webkit-flex;
display:-moz-flex;
display:flex;
-webkit-box-pack:start;
-moz-box-pack:start;
-webkit-flex-pack:start;
-moz-flex-pack:start;
-ms-flex-pack:start;
-webkit-justify-content:flex-start;
-moz-justify-content:flex-start;
justify-content:flex-start;
-webkit-box-lines:multiple;
-moz-box-lines:multiple;
-webkit-flex-wrap:wrap;
-moz-flex-wrap:wrap;
-ms-flex-wrap:wrap;
flex-wrap:wrap;
}

ul.col_c{
-webkit-box-pack:center;
-moz-box-pack:center;
-webkit-flex-pack:center;
-moz-flex-pack:center;
-ms-flex-pack:center;
-webkit-justify-content:center;
-moz-justify-content:center;
justify-content:center;
}

ul.col_s{
-webkit-box-pack:justify;
-moz-box-pack:justify;
-webkit-flex-pack:justify;
-moz-flex-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
-moz-justify-content:space-between;
justify-content:space-between;
}

ul.col_l{
-webkit-box-pack:start;
-moz-box-pack:start;
-webkit-flex-pack:start;
-moz-flex-pack:start;
-ms-flex-pack:start;
-webkit-justify-content:flex-start;
-moz-justify-content:flex-start;
justify-content:flex-start;
}

/**　2列　**/
.col02 > ul > li{
width: 50%;
box-sizing: border-box;
}
/**　3列　**/
.col03 > ul > li{
width: 33.3333333%;
box-sizing: border-box;
}
/**　4列　**/
.col04 > ul > li{
width: 25%;
box-sizing: border-box;
}
/**　5列　**/
.col05 > ul > li{
width: 20%;
box-sizing: border-box;
}


/**　逆　**/
ul.rev{
-webkit-box-direction:reverse;
-moz-box-direction:reverse;
-webkit-box-orient:horizontal;
-moz-box-orient:horizontal;
-webkit-flex-direction:row-reverse;
-moz-flex-direction:row-reverse;
flex-direction:row-reverse;
}

@media only screen and (max-width: 992px) {
ul.col_s,
ul.col_l{
-webkit-box-pack:center;
-moz-box-pack:center;
-webkit-flex-pack:center;
-moz-flex-pack:center;
-ms-flex-pack:center;
-webkit-justify-content:center;
-moz-justify-content:center;
justify-content:center;
}

.col05 > ul > li{
width: 33.33333333%;
}

.col04 > ul > li{
width: 33.3333333%;
}

.col02 > ul > li{
width: 100%;
}
}

@media only screen and (max-width: 768px) {
ul.rev{
-webkit-box-direction:normal;
-moz-box-direction:normal;
-webkit-box-orient:horizontal;
-moz-box-orient:horizontal;
-webkit-flex-direction:row;
-moz-flex-direction:row;
flex-direction:row;
}

.col05 > ul > li,
.col03 > ul > li{
width: 50%;
}

.col04 > ul > li{
width: 50%;
}
}
@media only screen and (max-width: 480px) {

.col03 > ul > li{ 
width: 100%;
}
}
/*reset*/
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;
   font-weight: unset;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
   display: block;
}

nav ul {
   list-style: none;
}
li {
   list-style: none;
}

blockquote,
q {
   quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
   content: "";
   content: none;
}

a {
   margin: 0;
   padding: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;
}

/* change colours to suit your needs */
ins {
   background-color: #ff9;
   color: #000;
   text-decoration: none;
}

/* change colours to suit your needs */
mark {
position: relative;
}

mark::after {
   content: "";
   position: absolute;
   /*background-image: linear-gradient(transparent 60%, #ff9 60%);*/
   bottom: -0.1em;
   background-color: #ff9;
   height: .75em;
   display: block;
   width: 100%;
   z-index: -1;
   left: 0;
}

del {
   text-decoration: line-through;
}

abbr[title],
dfn[title] {
   border-bottom: 1px dotted;
   cursor: help;
}

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

/* change border colour to suit your needs */
hr {
   display: block;
   height: 1px;
   border: 0;
   border-top: 1px solid #cccccc;
   margin: 1em 0;
   padding: 0;
}

input,
select {
   vertical-align: middle;
}

body {
   -webkit-text-size-adjust: 100%;
}
ol,
ul {
   list-style: none;
}

img {
   vertical-align: top;
   font-size: 0;
   line-height: 0;
}
a {
   text-decoration: none;
}