/*common_css*/
/*layout:117*/:root{
--systemfont:	 "Avenir", "Helvetica Neue", "Helvetica", "Arial","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo",	"游ゴシック", "Yu Gothic", "ＭＳ Ｐゴシック", sans-serif;
--base-width: 1100px;
--over-width-half: calc((100vw - var(--base-width)) / 2);
--smnr_color1:#00a0ca;
--smnr_color2:var(--colorYel);
--smnr_color3:#03cbf9;
}

body{
  min-width: var(--base-width);
}

.smnr_color1{
color: var(--smnr_color1);
font-size: 1.1em;
}

.smnr_color2{
color: var(--smnr_color2);
font-size: 1.1em;
}
section{
margin: 0;
width: 100%;
font-size: 2.3rem;
font-weight: bold
}

p a:not([class*="btn"]){
  color: var(--colorBlue);
}

.require{
      background-color: var(--colorBlue);
}


@media screen and (max-width:520px) {

:root{
--over-width-half: 5%;
}

body{
  min-width: 100%;
}

section{
font-size: 1.6rem;
}

p{
line-height: 1.7;
}

.titA {
 font-size: 2.8rem;
}

body .mb30{
  margin-bottom: 15px;
}

}


/**------------------------------ 
header
------------------------------**/
header{
  height: auto;
}

header .pc_cv{
  display: flex;
  justify-content: flex-end;
}

header .tel{
padding: 0 15px;
}

header .tel a{
height: auto;
display: flex;
align-items: center;
flex-flow: wrap;
font-size: 3rem;
line-height: 1;
gap: 5px;
margin: 15px 0 0;
}

header .tel p{
font-size: 1.4rem;
margin: 0 0 5px 70px;
line-height: 1;
}

header .tel svg{
width: 1.1em;
height: 1.1em;
fill:var(--colorMain);
}

header nav ul li.mail a{
background-color: var(--smnr_color1);
--border: none;
}


@media screen and (max-width:520px) {
header {
display: flex;
align-items: center;
}
}

.sp_fix{
background: rgba(0,0,0,0.6);
display: flex;
padding: 10px var(--over-width-half);
position: fixed;
bottom: 0;
left: 0;
z-index: 10;
width: 100%;

font-weight: bold;
gap: 10px;
}

.sp_fix a{
flex: 1;
display: flex;
align-items: center;
justify-content: center;
padding: 10px 0;
gap: 0 10px;
border: 2px solid var(--colorMain);
}

.sp_fix a svg{
width: 14px;
height: 20px;
margin: 0;
}

.sp_fix a.tel{
display: none;
background: var(--smnr_color2);
}

.sp_fix a.telpc{
  background: var(--smnr_color2);
  flex-flow: wrap;
  font-size: 2.6rem;
  line-height: 1;
}
.sp_fix a.telpc p{
  width: 100%;
  text-align: center;
  font-size: 14px;
  line-height: 1.3;
}
.sp_fix a.mail{
background: var(--smnr_color1);
color: #fff;
font-size: 2rem;
}
.sp_fix a.mail svg{
width: 19px;
fill:#fff;
}


@media screen and (max-width:520px) {
  .sp_fix{
    padding: 10px;
  }
  .sp_fix :is(a.tel,a.mail){
    font-size: 1.4rem;
    flex-flow: column;
    align-items: center;
  }
  .sp_fix a.tel{
    display: flex;
  }
  .sp_fix a.telpc{
    display:none;
  }
}


footer{
 padding-bottom: 80px;
} 

/**------------------------------ 
パーツ
------------------------------**/

.ttlA{
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
gap: 10px;

width: fit-content;
text-align: center;
font-weight: bold;
}

.ttlA div{
position: relative;
}
.ttlA strong{
display: block;
background: var(--colorMain);
color: var(--smnr_color2);
padding: 5px 30px;
position: relative;
z-index: 2;
font-size: 1.1em;
}
.ttlA div:after{
--c1:#ccc;
--c2:#fff;
content: "";
display: block;
width: calc(100% - 5px);
height: 100%;
background-image: linear-gradient(45deg, var(--c1) 25%, var(--c2) 25%, var(--c2) 50%, var(--c1) 50%, var(--c1) 75%, var(--c2) 75%);
background-size: 10px 10px;
position: absolute;
bottom: -10px;
left: 15px;
z-index: 1;
}

.ttlB{
font-weight: 900;
line-height: 2;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAAXNSR0IArs4c6QAAACFJREFUGFdjZGBgMGZgYDjLAAWMUBouCBMAiYMFkQXAggB4hQM4U4HiRAAAAABJRU5ErkJggg==);
-webkit-text-stroke: 1px var(--ts);
text-shadow: 2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff;
}

.ttlC{
  background: var(--colorMain);
  color:#fff;
  padding:10px 15px;
}

@media screen and (max-width:520px) {
.ttlA{
font-size: 2rem;
margin: 0 0 10px;
}
.ttlA strong{
padding: 5px 15px;
font-size: 2rem;
}
.ttlA div:after{
background-size: 8px 8px;
bottom: -8px;
left: 13px;
}
}

/**------------------------------ 
fv
------------------------------**/

.seminar-fv{
margin: 0;
text-align: center;
}

.seminar-fv img{
  aspect-ratio: 1500/683;
  width: 100%;
  height: auto;
}

@media screen and (max-width:1500px) {
  .seminar-fv{
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 683px;
  }
  .seminar-fv img{
    width: 1500px;
    height: auto;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
  }
}

@media screen and (max-width:520px) {
.seminar-fv{
height: auto;
height: and;
}
  .seminar-fv img{
    aspect-ratio: 750/1200;
    width: 100%;
    height: auto;
    position: static;
    transform: none;
  }
  
}

/**------------------------------ 
obi
------------------------------**/

.seminar-obi{
font-size: 3rem;
font-weight: bold;
text-align: center;
line-height: 1.6;
padding: 1em 0;
}

@media screen and (max-width:520px) {
.seminar-obi{
font-size: 1.7rem;
padding: 1em var(--over-width-half);
}
}

/**------------------------------ 
01
------------------------------**/

.seminar-01{
padding: 100px var(--over-width-half);
<!-- background: var(--colorMain_05)  url(/common/images/bg_03.png) repeat center / auto 100%; -->
}
.seminar-01 .ttl-p{
position: relative;
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
text-align: center;
gap: 40px;
padding: 25px;
border: 3px solid var(--colorMain);
background: #fff;
}
.seminar-01 .ttl-p:before,
.seminar-01 .ttl-p:after{
content: "";
height: 3px;
width: 90%;
background: #fff;
display: block;
position: absolute;
left: 5%;
}
.seminar-01 .ttl-p:before{
top: -3px;
}
.seminar-01 .ttl-p:after{
bottom: -3px;
}

@media screen and (max-width:520px) {
.seminar-01{
padding: 30px var(--over-width-half);
}
.seminar-01 .ttl-p{
gap: 10px;
padding: 15px;
}
}


/**------------------------------ 
02
------------------------------**/
.seminar-02{
background:  linear-gradient(to right bottom, var(--smnr_color1) 0%, var(--smnr_color2) 100%);
padding: 100px var(--over-width-half) 1px;
}

.seminar-02 :is(.seminar-inner1,.seminar-inner2){
background: #fff;
padding: 30px 230px 25px 30px;
position: relative;
font-family: var(--systemfont);
}

.seminar-02 .seminar-inner1{
border-radius: 5px 5px 0 0;
border-bottom: 2px dashed var(--colorMain);
--ts:var(--colorMain);
}

.seminar-02 .seminar-inner1 dl{
display: flex;
align-items: center;
gap: 20px;
margin: 0 0 10px;
border: 2px solid var(--colorMain);
background: var(--smnr_color2);
}

.seminar-02 .seminar-inner1 dl dt{
width: fit-content;
font-weight: bold;
font-size: 1em;
background: var(--colorMain);
color: #fff;
padding: 8px 15px;
}

.seminar-02 .ttlB{
font-size: 1.7em;
padding: 5px 20px;
margin: 15px 0 10px;
}

.seminar-02 .seminar-inner1 p{
font-size: 0.9em;
padding-left: 20px;
}

.seminar-02 .seminar-inner1 figure{
width: 250px;
position: absolute;
bottom:0;
right: 10px;
}
.seminar-02 .seminar-inner1 figure img{
width: 100%;
height: 100%;
object-fit: contain;
}

.seminar-02 .seminar-inner2{
border-radius: 0 0 5px 5px;
padding: 50px 30px;
margin: 0 0 100px;

--c_gap:100px;
position: relative;
}

.seminar-02 .seminar-inner2 .bln_line{
--blnLineArrow:10px;
--borderRadius:0;
width: 100%;
padding: 17px;
font-weight: bold;
border: none;
color: #00a0ca;
}.seminar-02 .seminar-inner2 .bln_line:after{
display: none;
}

.seminar-02 .seminar-inner2 .bln_line b{
  color:#e5005a;
}

.seminar-02 .seminar-inner2 dd{
padding: 0 25px 0 20px;
}

.seminar-02 .seminar-inner2 .seminar-innerL{
background-color: color-mix(in srgb,var(--smnr_color1) 10% , white 50% );
}
.seminar-02 .seminar-inner2 .seminar-innerR{
background-color: #f5fbfe;
border:1px solid #00a0ca;
}

.seminar-02 .seminar-inner2 .seminar-innerL:after{
content: "forward";
font-family: 'Material Icons';
font-size: 4em;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: var(--smnr_color1);
}

.seminar-02 .seminar-inner2 .seminar-innerL .bln_line{ 
background: var(--smnr_color1);
}
.seminar-02 .seminar-inner2 .seminar-innerL .bln_line:before{
border-top-color: var(--smnr_color1);
}

.seminar-02 .seminar-inner2 ul{
font-size: 0.8em;
margin: 0.5em 0;
}
.seminar-02 .seminar-inner2 ul li{
display: flex;
align-items: center;
gap: 15px;
margin: 0 5px 10px;
}
.seminar-02 .seminar-inner2 ul li span{
flex: none;
display: flex;
justify-content: center;
align-items: center;
width: 1.5em;
height: 1.5em;
font-size: 1.5em;
border-radius: 50px;
background: var(--colorMain);
color: #fff;
}

@media screen and (max-width:520px) {
.seminar-02{
padding: 50px var(--over-width-half) 20px;
}

.seminar-02 :is(.seminar-inner1,.seminar-inner2){
padding: 15px;
}

.seminar-02 .seminar-inner1{
}

.seminar-02 .seminar-inner1 dl{
flex-flow: column;
gap: 5px;
font-size: 1.2em;
text-align: center;
}

.seminar-02 .ttlB{
font-size: 1.2em;
line-height: 1.6;
padding: 5px 20px;
margin: 0 0 15px;
}

.seminar-02 .seminar-inner1 p{
padding-left: 15px;
}

.seminar-02 .seminar-inner1 figure{
width: 100px;
position: absolute;
bottom:0;
right: 0;
}
.seminar-02 .seminar-inner1 figure img{
width: 100%;
height: 100%;
object-fit: contain;
}

.seminar-02 .seminar-inner2{
padding: 15px;
margin: 0 0 40px;
}

.seminar-02 .seminar-inner2 dd{
padding: 0 10px;
}

.seminar-02 .seminar-inner2 ul{
font-size: 1em;
margin: 1.5em 0;
}
.seminar-02 .seminar-inner2 .seminar-innerL{
position: relative;
}
.seminar-02 .seminar-inner2 .seminar-innerL:after{
bottom: -60px;
top: auto;
transform: translateX(-50%) rotate(90deg);
}

}

/**------------------------------ 
03
------------------------------**/
.seminar-03{
/*background: var(--colorMain_05);*/
padding: 60px var(--over-width-half) 100px;
}

.seminar-03 h2 p{
  font-size: 30px;
  color: #00a0ca;
}

.seminar-03 .table table{
font-family: var(--systemfont);
--tableWidth:20%;
font-size: 0.9em;
border: 3px solid var(--colorMain);
margin: 50px 0 0;
}
.seminar-03 .table table :is(th,td){
border-bottom: 1px dotted var(--colorMain);
}
.seminar-03 .table table td{
font-size: 1.1em;
}

.seminar-03 .table table tr:last-child :is(th,td){
border: none;
}
.seminar-03 .table table th:before{
content: "";
display: inline-block;
width: 0.3em;
height: 1px;
background: var(--colorMain);
}
.seminar-03 .table p{
line-height: 1.5;

}
.seminar-03 .table p+p{
margin: 30px 0 0;

}
.seminar-03 .table small{
display: block;
font-size: 0.75em;
line-height: 1.5;
margin: 8px 0 0;
font-weight: normal;
}

.seminar-03 .table em{
display: inline-block;
background: var(--colorMain);
color: #fff;
padding: 3px 10px;
vertical-align: middle;
margin: 0 10px 0 0;
}

.seminar-03 .table b{
display: block;
margin: 8px 0 0;
font-weight: normal;
font-size: 1em;
}

.seminar-03 .ttlB{
font-size: 1.1em;
padding: 5px 10px;
margin: 10px 0;
}

@media screen and (max-width:520px) {
.seminar-03{
padding: 30px var(--over-width-half) 50px;
}

.seminar-03 h2 p{
  font-size: 23px;
}

.seminar-03 .table table{
--tableWidth:100%;
font-size: 1.1em;
margin: 20px 0 0;
}
.seminar-03 .table :is(table,tbody,tr,th,td){
display: block;
width: 100%;
} 

.seminar-03 .table table :is(th,td){
border: none;
padding: 15px;
}
.seminar-03 .table table td{
font-size: 2rem;
}

.seminar-03 .table table tr:last-child :is(th,td){
border: none;
}
.seminar-03 .table table th{
background: var(--colorMain_05);
}
.seminar-03 .table table th:before{
display: none;
}
}


/**------------------------------ 
04
------------------------------**/
.seminar-04 {
background: linear-gradient(to right, var(--smnr_color1) 0%, var(--smnr_color3) 50%,var(--colorBlue) 100%);
padding: 60px var(--over-width-half);
position: relative;
color: #fff;
overflow: hidden;
}

.seminar-04:before{
content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background: url(/common/images/bg_01.png);
mix-blend-mode:multiply;
}

.seminar-04 .dl{
font-family: var(--systemfont);
background: #fff;
color: var(--colorMain);
padding: 60px 30px 40px;
position: relative;
margin: 70px auto;
text-align: center;
box-shadow: 0 0 5px 5px rgba(0,0,0,0.1);
max-width: 50%;
}

.seminar-04 .lh45{
  line-height: 45px;
}

.seminar-04 .fcr{
  color: red;
}

.seminar-04 em{
display: flex;
justify-content: center;
align-items: center;
background: #fff;
color:var(--smnr_color1);
margin: 0 auto 0;
border-radius: 50%;
font-size: 3rem;
width: 100px;
height: 100px;
border: 5px solid var(--smnr_color1);
position: absolute;
top: -50px;
left: 50%;
transform: translateX(-50%);
box-shadow: 0 0 0 10px #fff;
}

.seminar-04 .tokuten{
position: relative;
}

.seminar-04 .tokuten .dl{
position: relative;
padding-bottom: 30px;
z-index: 2;
    width: 780px;
    max-width: 100%;
    margin: 0px auto 30px;
}

.seminar-04 .tokuten em{
font-size: 2.5rem;
background:  var(--smnr_color1);
color: #fff;
border: none;
transform: none;
left: -20px;
}

.seminar-04 .tokuten .ttlB{
font-size: 2.7rem;
margin: 0 0 15px;
}

.seminar-04 .tokuten strong{
font-size: 2.5rem;
color: var(--smnr_color1);
}

.seminar-04 .tokuten figure{
position: absolute;
top: -60px;
z-index: 1;
width: 200px;
height: auto;
z-index: 3;
}

.seminar-04 .tokuten .present1{
right: 179px;
transform: rotate(-10deg);
}
.seminar-04 .tokuten .present2{
right: 21px;
transform: rotate(15deg);
}

.seminar-04 .tokuten .p{
  font-size: 1.6rem;
  line-height: 1.5;
  margin: 15px 0 0;
}

.seminar-04 a{
display: block;
font-size: 2rem;
padding: 15px 0;
border: 2px solid var(--colorMain);
margin: 20px 0 0;
position: relative;
box-shadow: 5px 5px 0 0 rgba(0,0,0,0.3);
}
.seminar-04 a:after{
content: "→";
position: absolute;
top: 50%;
right: 0px;
transform: translateY(-50%);
}
.seminar-04 a.tel{
background: var(--smnr_color2);
}
.seminar-04 a.mail{
background: var(--smnr_color1);
color: #fff;
}

@media screen and (max-width:520px) {
.seminar-04 {
padding: 50px var(--over-width-half);
}

.seminar-04 .dl{
padding: 60px 15px 30px;
position: relative;
margin: 70px auto;
max-width: none;
}

.seminar-04 .lh45{
  line-height: 35px;
}

.seminar-04 em{
font-size: 3rem;
width: 90px;
height: 90px;
border: 5px solid var(--smnr_color1);
top: -40px;
left: 50%;
box-shadow: 0 0 0 8px #fff;
}

.seminar-04 .tokuten .dl{
padding-bottom: 30px;
margin-bottom: 20px;
margin-top: 50px;
}

.seminar-04 .tokuten em{
font-size: 2rem;
left: -5px;
}

.seminar-04 .tokuten .ttlB{
font-size: 2.4rem;
margin: 0 0 15px;
}

.seminar-04 .tokuten strong{
font-size: 2rem;
}

.seminar-04 .tokuten figure{
top:0%;
width: 150px;
}

.seminar-04 .tokuten .present1{
right: 100px;
transform: rotate(-10deg);
}
.seminar-04 .tokuten .present2{
top: 0%;
right: -15px;
transform: rotate(15deg);
}

.seminar-04 .box2C{
--r_gap: 0;
}

}

/**------------------------------ 
05
------------------------------**/

.seminar-05{
background: url(/common/images/bg_01.png);
padding: 100px var(--over-width-half);
position: relative;
}

.ttl-tel{
display: flex;
align-items: center;
justify-content: space-between;
gap: 50px;
}

.ttl-tel dl{
flex: 1;
}

.ttl-tel dt{
display: flex;
align-items: center;
font-weight: bold;
font-size: 4.3rem;
margin: 0 0 20px;
gap: 10px;
}

.ttl-tel dt:after{
content: "";
flex: 1;
height: 1px;
background: var(--colorMain);
}

.ttl-tel .tel .btnA{
font-size: 3.2rem;
border-radius: 0;
padding: 20px 50px;
margin: 0 0 15px;
color: var(--colorMain);
border-width: 3px;
box-shadow: 5px 5px 0 0 rgba(0,0,0,0.3);
}
.ttl-tel .tel .btnA:after{
content: "→";
position: absolute;
top: 50%;
right: 0px;
transform: translateY(-50%);
}

.ttl-tel .tel .btnA svg{
width: 1.2em;
height: 1.2em;
fill:var(--colorMain);
margin-bottom: -5px;
}

.ttl-tel small{
display: block;
text-align: center;
}

@media screen and (max-width:520px) {
.seminar-05{
padding: 40px var(--over-width-half);
}

.ttl-tel{
flex-flow: column;
gap: 30px;
}

.ttl-tel dl{
flex: 1;
}

.ttl-tel dt{
font-size: 2.5rem;
margin: 0 0 15px;
}
.ttl-tel .tel{
width: 100%;
}

.ttl-tel .tel .btnA{
font-size: 2.8rem;
padding: 20px 20px 20px 10px;
}
.ttl-tel small{
font-size: 1.4rem;
}
}



/**------------------------------ 
entry
------------------------------**/

.seminar-entry{
padding: 100px var(--over-width-half);
position: relative;
}

.seminar-entry .ttlB{
  padding: 5px 15px;
}

form .owlet-input-sample{
font-weight: normal;
}

form table tr td input:not(input[type="checkbox"],input[type="radio"]) {
height: 2.5em;
}

form table tr td label + label{
  padding-top:15px;
}

.seminar-entry .table table{
font-family: var(--systemfont);
--tableWidth:100%;
--border: 1px solid var(--colorMain_50);
font-size: 1em;
border: 3px solid var(--colorMain);
margin: 0 0 0;
}

.seminar-entry .table :is(table,tbody,tr,th,td){
display: block;
width: 100%;
}

.seminar-entry .table table :is(th,td){
font-size: 1.7rem;
}

.seminar-entry .table table th{
border-top: 1px dotted var(--colorMain);
border-bottom: 1px dotted var(--colorMain);
background: var(--colorMain_05);
}


.seminar-entry .table table tr:first-child th{
border-top: none;
}


@media screen and (max-width:520px) {
.seminar-entry{
padding: 40px var(--over-width-half);
}

.seminar-entry .table table{
font-size: 1em;
}


.seminar-entry .table table :is(th,td){
border: none;
padding: 15px;
}

}/*PAGE*/#entry{
  display: none;
}