@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700,900&display=swap&subset=japanese'); 
@import "https://fonts.googleapis.com/css?family=Judson"; /*「QUALITA」欧文表記用*/
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,500,0,0');
@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+SC&display=swap');


/*-------------------------------------------------Reset*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%; font-style: normal;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}

ol,ul,li{list-style:none}

img{border-style:none}
img:focus,img:active{outline:none}
strong{ font-weight: bold}

html{width:100%;min-width: 1100px;overflow-x:auto;}
body{width:100%;position:relative;color:#333;font-size:14px;line-height:1.6;margin:0;font-family:"Noto Sans JP","Yu Gothic","YuGothic",sans-serif;font-feature-settings: "palt";letter-spacing: 0.5px;}

a{color:#bda662;text-decoration:underline;-webkit-transition: all .3s ease-out; }
a:hover{text-decoration:none; -webkit-transition: all .3s ease-out; }


.pcHeader,.pcFooter{display:block}
.spHeader,.spFooter{display:none}
.sp{display:none}

.min{font-family: 'Zen Old Mincho', serif;letter-spacing: 0;}
.serif,.FontEn{font-family: 'Cormorant SC', serif;letter-spacing: 1px;}
.jud{font-family:'Judson',serif;font-size:125%;font-weight:400!important;letter-spacing: 1px;}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  pankuzu
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
.pankuzu,#breadcrumb{padding: 16px 0;width: 100%;background-color:#fff;word-break:break-all}
.pankuzu,#breadcrumb ul{
	width: 1000px;
	margin: 0 auto;
}
.pankuzu li,#breadcrumb li{padding:0 10px 0 0;display:inline;font-size:12px;word-break:break-all;}
.pankuzu li a,#breadcrumb li a{color:#939393;text-decoration:none;word-break:break-all;}
.pankuzu li:after,#breadcrumb li:after{content:"\e315"; font-family:'Material Symbols Outlined';padding-left:10px}
.pankuzu li:last-child:after,#breadcrumb li:last-child:after{display:none}
.pankuzu::-webkit-scrollbar,#breadcrumb::-webkit-scrollbar{height:10px}
.pankuzu::-webkit-scrollbar-track,#breadcrumb::-webkit-scrollbar-track{background-color:#FFF}
.pankuzu::-webkit-scrollbar-thumb,#breadcrumb::-webkit-scrollbar-thumb{background-color:rgba(238,238,238,0.8)}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  CommonTtl
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
.CommonTtl{text-align:center;color:#bda661;margin-bottom: 30px;}
#breadcrumb + .CommonTtl,
#breadcrumb + section .CommonTtl{padding-top: 20px;margin-bottom: 40px;}
.CommonTtl .main{font-size:40px;line-height:1;padding-bottom: 5px;font-weight:400}
.CommonTtl .sub{font-size:16px;line-height:1.4}
.CommonTtl .desc{font-size: 18px;padding-bottom:15px;}



/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  loading
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
.loadingWrap{ position:relative;  }
.loadingIn{opacity:0;transition:0.3s;height: 150px;overflow: auto;}
.loadingIn.is_active{opacity:1;height:auto;overflow: inherit;}
.loading{
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10;
	margin-top: -25px;
	margin-left: -25px;
	background-image: url(/assets_own/img/common/spin-black.svg);
	background-repeat: no-repeat;
	background-position: center center;
	width: 50px;
	height: 50px;
	background-size: contain;
}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  Footer
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
#Footer{width:100%;background-color:#0b2536;padding-top:60px;color:#fff}
#Footer .Attention{background-color:#284354;margin:0 auto;border:1px solid #fff;margin-bottom:30px;width:1000px;padding: 20px;box-sizing: border-box;}
#Footer .Attention .shisaku{
	text-align: center;
	font-size: 15px;
	font-weight: bold;
}
#Footer .Attention dt{color:#e6d284;font-size: 18px;font-weight: bold;text-align: center;padding-bottom: 8px;}
#Footer .Attention a{color:#fff}
#Footer .Attention .pc_none{display: none;}

#Footer .point{background-color: #ffffff;border: 1px solid #da0c0c;width: 760px;}
#Footer .point dt{color: #da0c0c;}
#Footer .point dd{color: #da0c0c;}

#Footer .Inner{width:1000px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap}
#Footer .Inner:after{content:"";display: block;width: 35%;height: 1px;}
#Footer .Inner .Entry{width: 22%;margin-bottom:40px;position:relative;/* padding-bottom:44px; */}
#Footer .Inner .Entry h3{font-size:25px;margin-bottom:7px;display:flex;align-items:center}
#Footer .Inner .Entry h3:before,#Footer .Inner .Entry h3:after{content:"";display:block;margin:7px;flex:1;border-bottom:1px solid #757a7d}
#Footer .Inner .Entry .main{
    text-align: center;
}
#Footer .Inner .Entry .main dl{/* display:flex; *//* align-items:center; *//* flex-wrap:wrap; *//* margin-left:6px; */margin-bottom: 10px;}
#Footer .Inner .Entry#shibuya .main dl,#Footer .Inner .Entry#yokohama .main dl,#Footer .Inner .Entry#marunouchi .main dl{display:block;text-align:center}
#Footer .Inner .Entry .main dt{/* width:9em; *//* text-align:left; */font-weight: bold;padding-bottom: 3px;font-size: 12px;}
#Footer .Inner .Entry .main dd{/* text-align:left; */font-size: 19px;}
#Footer .Inner .Entry#shibuya .main dt,#Footer .Inner .Entry#yokohama .main dt,#Footer .Inner .Entry#marunouchi .main dt{padding-right:0;width:100%}
#Footer .Inner .Entry#shibuya .main dd,#Footer .Inner .Entry#yokohama .main dd,#Footer .Inner .Entry#marunouchi .main dd{}
#Footer .Inner .Entry .main dl + dl{margin-top: 10px;}
#Footer .Inner .Entry .main .time{margin-top:9px;font-size:12px;display:flex;flex-wrap:wrap;justify-content:flex-start}
#Footer .Inner .Entry .main .time li{padding-right:10px}
#Footer .Inner .Entry .main .time .ttl{width:100%;color:#e6d284}
#Footer .Inner .Entry .main .time li + .ttl{padding-top:7px}
#Footer .Inner .Entry .main .btn{/* position:absolute; */width:100%;/* display:flex; */bottom:0;justify-content:space-between}
#Footer .Inner .Entry .main .btn li{
    flex: 1;
}
#Footer .Inner .Entry .main .btn li + li{/* margin-left: 7px; */margin-top: 7px;}
#Footer .Inner .Entry .main .btn li a{color:#fff;border:1px solid #fff;border-radius:50px;padding:5px;position:relative;display: block;text-decoration: none;}
#Footer .Inner .Entry .main .btn li a:hover{background:#284354}
#Footer .Inner .Entry .main .btn li a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\e315"; font-family:'Material Symbols Outlined'; line-height: 1}
#Footer .Inner .Entry .main .shisaku{
	margin-top: 10px;
}
#Footer .Inner .Entry .main .shisaku a{
	color: #fff;
	font-weight: bold;
}
#FooterBtm{background-color:#081b27;padding:20px 0;margin-top:30px}
#FooterBtm .Inner{}
#FooterBtm .Inner .sns{display:flex}
#FooterBtm .Inner .sns li{margin-right:10px}
#FooterBtm .Inner .sns li + li{}
#FooterBtm .Inner .copyright{}

/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  footerBn
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
#footerBn{width:1000px;margin:0 auto;border-top:1px solid #ccc;padding-top:30px;margin-bottom:60px;margin-top:50px}
#footerBn ul{display:flex;flex-wrap: wrap;justify-content: flex-start;}
#footerBn li{width: 19.1%;height:80px;margin-right: 10px;margin-bottom: 10px;}
#footerBn li:nth-of-type(5){
	margin-right: 0;
}
#footerBn li a{display:block;text-decoration:none;background-position:center;background-repeat:no-repeat;background-size:cover;display:flex;height:100%;justify-content:center;align-items:center;position:relative}
#footerBn li a:before{-webkit-transition:all .3s ease-out;content:"";background-color:rgba(0,0,0,0.4);display:block;position:absolute;width:100%;height:100%;top:0;left:0}
#footerBn li a p{color:#fff;font-size: 13px;position:relative;font-weight: bold;}
#footerBn li a p span{
    display: block;
    text-align: center;
}


#footerBn li a[href*="pamphlet"]{ background-image: url("/assets/img/common/bnr_pamf.jpg")}
#footerBn li a[href*="cancel_support"]{ background-image: url("/assets/img/common/bnr_cancel_support.jpg")}
#footerBn li a[href*="mail_magazine"]{ background-image: url("/assets/img/common/bnr_mailmagazine.jpg")}
#footerBn li a[href*="topic"]{ background-image: url("/assets/img/common/bnr_topic.jpg")}
#footerBn li a[href*="//blog.his-j.com/qualita/"]{ background-image: url("/assets/img/common/bnr_STAFFBLOG_shinjuku.jpg")}
#footerBn li a[href*="classone"]{ background-image: url("/assets/img/common/bnr_classone.jpg")}
#footerBn li a[href*="//goods.his-j.com/"]{ background-image: url("/assets/img/common/bnr_ichiba.jpg")}
#footerBn li a[href*="/special/videochat/"]{ background-image: url("/assets/img/common/bnr_document.jpg")}
#footerBn li a[href*="/about/event.html"]{ background-image: url("/assets/img/common/bnr_event.jpg")}
#footerBn li a[href*="/carrier/"]{ background-image: url("/assets/img/common/bnr_businessguide.jpg")}
#footerBn li a[href*="/classone/members.html"]{ background-image: url("/assets/img/common/bnr_businesstokten.jpg")}


#footerBn li a:hover:before{background-color: rgba(0, 0, 0, 0.7);}

.bannerArea ul a{
    display: block;
    position:relative;
    text-decoration: none;
}
.bannerArea ul a:before{-webkit-transition:all .3s ease-out;content:"";background-color:rgba(0,0,0,0.4);display:block;position:absolute;width:100%;height:100%;top:0;left:0}
.bannerArea ul a:hover:before{background-color: rgba(0, 0, 0, 0.7);}
.bannerArea ul p{
    text-decoration: none;
    position: absolute;
    color: #fff;
    width: 100%;
    font-size: 16px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.bannerArea .imgBox{line-height:0;padding: 0;}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  page-top
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
#page-top{width: 102px;height: 54px;position:fixed;z-index:1100;bottom: 0;right:20px;background-color:#bda662;color:#fff;opacity:.75;text-decoration:none;text-align:center}
#page-top:hover{opacity:1}
#page-top:before{display:inline-block;content:"\e5d8";font-family:'Material Symbols Outlined';font-style:normal;font-weight:400;font-size:50px;line-height: 0.6;}
#page-top .text{display:block;margin-top: -9px;font-size: 13px;font-family: 'Cormorant SC', serif;font-weight: normal;}


/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
/*  ContactIconBtn
/*-----------------------------------------------------------------------------------------------------------------------------------------------*/
#ContactIconBtn{
    position: fixed;
    bottom: 125px;
    right: 20px;
    z-index: 999999;
    padding: 10px;
    box-shadow: 0 0 5px rgb(0 0 0 / 50%);
    background-color: rgb(255 255 255 / 80%);
    border-radius: 3px;
}
#ContactIconBtn .delete {
    box-sizing: border-box;
    -webkit-transition: all .3s ease-out;
    position: absolute;
    display: block;
    transform: scale(var(--ggs,1));
    width: 20px;
    height: 20px;
    border: 2px solid;
    border-radius: 100%;
    top: -10px;
    right: -7px;
    background-color: #fff;
    background-color: #333;
}
#ContactIconBtn .delete:hover{
    cursor: pointer;
    background-color: #98854d;
    border-color: #98854d;
}
#ContactIconBtn .delete::after,
#ContactIconBtn .delete::before {
    content: "";
    display: block;
    box-sizing: border-box;
    position: absolute;
    width: 10px;
    height: 2px;
    background: #fff;
    transform: rotate(45deg);
    border-radius: 5px;
    top: 7px;
    left: 3px
}
#ContactIconBtn .delete::after {
    transform: rotate(-45deg)
}
#ContactIconBtn p{font-size: 15px;font-weight: bold;color: #323232;margin-bottom: 1px;text-align: center;line-height: 1.4;padding-bottom: 5px;}
#ContactIconBtn ul{
    /* padding: 5px; */
    padding-right: 0;
}
#ContactIconBtn li{}
#ContactIconBtn li + li{
    /* margin-top: 1px; */
    /* border-top: 1px solid #ccc; */
    margin-top: 7px;
}
#ContactIconBtn a{}

#ContactIconBtn a:after{position: absolute;right: 5px;top:50%;margin-top:-0.5em;content:"\e89e";font-family:'Material Symbols Outlined';line-height: 1;font-size: 13px;}

#ContactIconBtn a {
  text-decoration: none;
  background: #292929;
  color: #fff;
  text-align: center;
  padding: 12px 19px;
  box-sizing: border-box;
  border-radius: 3px;
  margin-left: 0;
  display: block;
  font-size: 14px;
  position: relative;
  padding-right: 24px;
  line-height: 1.3;
}
#ContactIconBtn a:hover{
    background: #bda662;
}
/*------------------------------------------floatingBn-*/
#floatingBn{
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 999;
  padding: 10px 0;
}
#floatingBn p{    width: 600px;    margin: 0 auto;position: relative;}
#floatingBn img{width: 100%;height: auto;}
#floatingBn a{
    display: block;
    text-decoration: none;
}
#floatingBn a:hover{ opacity: 0.7}
#floatingBn .delete{width: 23px;color: #fff;text-align: center;display: block;position: absolute;top: -4px;right: -17px;}
#floatingBn .delete:after{content: "\f00d";font-family:'Material Symbols Outlined';background-color: #000;display: flex;justify-content: center;align-items: center;padding-bottom: 1px;box-sizing: border-box;border: 2px solid #fff;box-shadow: 0 0 3px #000;border-radius: 100%;height: 23px;}
#floatingBn .delete:hover{cursor: pointer}

/*----------------------------OnlineMTG*/
#OnlineMTG{position: relative;width: 800px;margin: 0 auto;background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);border-radius: 5px;padding: 10px;box-sizing: border-box;box-shadow: 2px 2px 5px #9e9e9e;border: 2px solid #fff;margin-bottom: 50px;}
#OnlineMTG .Inner{
    background-color: #fff;
    border-radius: 5px;
    display: flex;
    padding: 20px;
    padding-top: 10px;
    color: #000;
    align-items: center;
}
#OnlineMTG .Main{
    flex: 1;
    padding-right: 20px;
    padding-bottom: 10px;
    text-align: center;
}
#OnlineMTG .Main h3{
    font-size: 25px;
    color: #24b2a9;
    font-style: italic;
    background: linear-gradient(transparent 70%, #ffff95 70%);
    display: inline-block;
    line-height: 1.4;
    margin-bottom: 18px;
}
#OnlineMTG .Main h4{
    color: #24b2a9;
    font-size: 17px;
    font-style: italic;
}
#OnlineMTG .Main h3 br{ display: none}
#OnlineMTG .Main h3 strong{
    font-size: 140%;
    display: inline-block;
    padding: 0 2px;
    font-weight: 900;
}
#OnlineMTG .Main ul{
    font-size: 15px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 11px;
    position: relative;
    justify-content: space-evenly;
}

#OnlineMTG .Main li{position:relative;padding-left:16px;box-sizing: border-box;/* margin-right: 20px; */font-weight: bold;padding-bottom: 2px;}
#OnlineMTG .Main li:before{content:"\e86c"; display:block; float:left; margin-left:-18px; width:1em; text-align:center; font-family:'Material Symbols Outlined';}
#OnlineMTG .btn{
    text-align: center;
    display: flex;
    align-items: center;
}
#OnlineMTG .btn dt{
    font-weight: bold;
    font-size: 13px;
    display: inline-block;
    position: relative;
    line-height: 1.4;
    padding: 10px 0;
    margin-right: 20px;
}
#OnlineMTG .btn dt:before, #OnlineMTG .btn dt:after {
  content: '';
  position: absolute;
  display: inline-block;
  width: 74px;
  height: 2px;
  background-color: black;
  transform: rotate(8deg);
}
#OnlineMTG .btn dt:before {
  left: 20px;
  top: 2px;
}
#OnlineMTG .btn dt:after {
  right: 0;
  transform: rotate(-8deg);
  bottom: -2px;
}
#OnlineMTG .btn dt strong{
    font-size: 140%;
}

#OnlineMTG .btn dd{
    flex: 1;
}
#OnlineMTG .btn dd a{
    position: relative;
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
    font-weight: bold;
    color: #000;
    text-decoration: none;
    padding: 12px 23px 12px 28px;
    font-size: 17px;
    border-radius: 5px;
    display: block;
}
#OnlineMTG .btn dd a:hover{
 background-color: #79c0bc;
 background-image: inherit;
 color: #fff;
}
#OnlineMTG .btn dd a:before{position: absolute;left: 11px;top:50%;margin-top:-0.5em;/* content:"\f08e"; */font-family:'Material Symbols Outlined';line-height: 1;font-size: 15px;}
#OnlineMTG .btn dd a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\e315"; font-family:'Material Symbols Outlined'; line-height: 1}
#OnlineMTG .Photo{
    width: 200px;
    height: 200px;
    padding-top: 5px;
}
#OnlineMTG .Photo img{
    width: 100%;
    height: auto;
    border-radius: 100%;
}

