@charset "UTF-8";

/* ===================================
	File Name   : etc.css
	Description : ETC Page Layout CSS
	Editor      : Bface Hayakawa
	Last Editor : Bface Otake
	
	Update Description :
  [2025/06/5] お問い合わせページ h2削除
  [2025/04/23] 背景、余白調整 サイトマップ追加
  [2023/02/07] indexページのスタイル調整
  [2021/09/16] セミナー説明会ページ05作成
  [2021/08/24] セミナー説明会ページ04作成
  [2021/07/12] セミナー説明会ページ02作成
  [2021/06/01] セミナー説明会ページ作成
  [2021/03/30] 2022改訂調整
	[2020/11/17] スマート装飾ページ　新規作成
	[2020/11/17] etc_appointment　追加
	[2020/07/20] etc_corona　追加
	[2020/05/27] メディアパートナー追加

====================================== */

/*========== Style Contents ==========

	1. Share Elements
	2. Information Detail Page
	3. Form Page
	4. Photogallery Page
	5. Download Page
	6. Media Partner Page
	7. Corona Page
	8. Appointment Page
	9. Smart Decoration Page
	10. Seminar Information Page
	11. Documents Page
	12. Sitemap Page
	
====================================== */



/*===== ■1. Share Elements =====*/
.iframe_responsive {
  position: relative;
  width: 100%;
  margin-bottom: 10px;
  padding: calc(315 / 560 * 100%) 0 0;
}
.iframe_responsive iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/*===== ■2. Information Detail Page =====*/

#information_detail .inner > p { 
  margin: 0 20px;
  text-indent: -1em;
   padding-left: 1em;
}

#information_detail .inner > dl.li-mr dt { 
  text-indent: -1em;
   padding-left: 1em;
}

#information_detail .inner > p em {
  display: block;
  margin: 30px 0;
  color: #d71518;
  font-weight: bold;
  font-size: 2.0rem;
  line-height: 1.4;
  text-align: center;
}
#information_detail .inner > p:not(:last-child) { margin-bottom: 30px;}
#information_detail .inner > p + p.notice { 
  margin: -20px 20px 30px;
} 

#information_detail .inner > p.sign {
  text-align: right;
  font-weight: bold;
  font-size: 1.8rem;
}

#information_detail.type02 .inner > p:not(:last-child) {
  margin-bottom: 15px;
  text-indent: 0;
  padding-left: 0;
}


@media (max-width: 768px) {
  #information_detail .inner > p { margin: 0;}
  
  #information_detail .inner > p em {
    margin: 4vw 0;
    font-size: 1.4rem;
    line-height: 1.6;
  }
  
  #information_detail .inner > p:not(:last-child) { margin-bottom: 4vw;}
  #information_detail .inner > p + p.notice { margin: -2.67vw 0 4vw;} 
  
  #information_detail .inner > p.sign { font-size: 1.6rem;}
}



/*===== ■3. Form Page =====*/
#form_application {
  position: relative;
  padding: 0 20px;
}

#form_application #form_preface {
  margin: 60px 20px;
  text-align: center;
  font-weight: 700;
  font-size: 2rem;
}

#form_application table {
  height: 50px;
}

#form_application table th {
  background: #666;
  color: #fff;
}

#form_application table td {
  background: rgba(0, 0, 0, .05);
}

@media (max-width: 768px) {
  #form_application {
    position: relative;
    padding: 0 2.67vw;
  }
  #form_application div.inner {
    position: relative;
    padding: 0 2.67vw 4vw;
  }
  #form_application #form_preface {
    margin: 6.67vw 0;
    padding-bottom: 4vw;
    text-align: left;
    font-size: 1.4rem;
  }
  #form_application .single {
    flex-direction: column;
  }
  #form_application .single a {
    width: 100%;
    margin-bottom: 4vw;
  }
}


/*===== ■4. Photogallery Page =====*/
#etc_photogallery #visual p > br {display: none;}

#photogallery_photo p {
  margin-bottom: 30px;
  text-align: center;
}

#photogallery_photo .inner > a {margin-bottom: 30px;}

#photogallery_photo p br {display: none;}

#photogallery_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 10px;
}

#photogallery_list::after {
  display: block;
  width: calc(50% - 10px);
  content:'';
}

#photogallery_list li {
  position: relative;
  width: calc(25% - 10px);
  margin-bottom: 10px;
}

#photogallery_list li a::before {
  display: inline-block;
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 20px;
  height: 15px;
  background: url("../img/etc/img-open.svg") no-repeat center / contain;
  content:"";
  z-index: 1;
}

#photogallery_list li a::after {
  position: absolute;
  bottom: 0;
  right: 0;
  border-left: 50px solid transparent;
  border-bottom: 50px solid #8a0e10;
  content:"";
}

#photogallery_list li img,
#photogallery_list li canvas{
  width: 100%;
  vertical-align: bottom;
  filter: brightness(80%) sepia(90%);
  transition: filter .25s;
}

#photogallery_list li a:hover img {
  opacity: 1;
  filter: brightness(100%) sepia(0%);
}


@media (max-width: 768px) {
  #etc_photogallery #visual p > br {display: block;}
  
  #photogallery_movie section {
    width: 100%;
    margin-bottom: 5.34vw;
  }
  #photogallery_movie section:last-child {
    margin-bottom: 0;
  }
  
  #photogallery_photo p br {display: block;}
  
  #photogallery_photo .inner > a {display: none;}
  
  #photogallery_list {margin-bottom: 0;}
  
  #photogallery_list li {
    width: calc(50% - 1.34vw);
    margin-bottom: 2.67vw;
  }
  
  #photogallery_list li a::before {
    bottom: 1.34vw;
    right: 1.34vw;
    width: 4vw;
    height: 2.94vw;
  }
  
  #photogallery_list li a::after {
    border-left: 10.67vw solid transparent;
    border-bottom: 10.67vw solid #8a0e10;
  }
  
  #photogallery_list li a:hover img {
    filter: none;
  }

  #photogallery_list li img {
    filter: brightness(100%) sepia(0%);
  }
}


/*===== ■5. Download Page =====*/
#download_condition .inner > p {
  margin-bottom: 30px;
  font-weight: bold;
  text-align: center;
}
  
#download_condition li > em {
  display: inline-block;
  position: relative;
  padding-left: 12px;
  font-weight: bold;
  line-height: 1.4;
}

#download_condition li:not(:last-child) > em { margin-bottom: 10px;}

#download_condition li > em:before {
  position: absolute;
  top: 8px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #333;
  transform: translateY(-50%);
  content: "";
}

#download_condition ul ul {
  margin: 0 12px 20px;
}

#download_condition ul ul li {
  position: relative;
  padding-left: 1.2rem;
  line-height: 1.4;
  font-size: 1.4rem;
}

#download_condition ul ul li:not(:last-child) {
  margin-bottom: 5px;
}

#download_condition ul ul li:before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 1rem;
  height: 1px;
  background: #333;
  transform: translateY(-50%);
  content: "";
}

.download_logo {text-align: center;}

.download_logo > figure {
  width: 50%;
  margin: 0 auto 25px;
}

.download_banner > figure:not(:last-child) {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #ccc;
}

.download_banner > figure span { text-align: center;}

.download_banner .size_300x250 span img {
  max-width: 150px;
}

.download_banner .size_160x600 span img {
  max-width: 80px;
}

.download_banner .size_468x60 span img {
  max-width: 234px;
}

.download_banner input {
  width: 100%;
  padding: 5px;
  background: #fff;
  border: 1px solid #ddd;
}

.download_banner .flex2 {align-items: flex-start;}


@media (max-width: 768px) {
  #download_condition .inner > p { margin-bottom: 8vw;}

  #download_condition li > em { padding-left: 2.67vw;}

  #download_condition li:not(:last-child) > em { margin-bottom: 2.67vw;}

  #download_condition li > em:before {
    top: 2.67vw;
    width: 1.6vw;
    height: 1.6vw;
  }

  #download_condition ul ul { margin: 0 0 5.34vw 2.67vw;}
  
  #download_condition ul ul li { font-size: 1.2rem;}
  
  #download_condition ul ul li:not(:last-child) { margin-bottom: 1.34vw;}
  
  #download_condition ul ul li:before {top: 2.4vw;}
    
  .download_logo {margin-bottom: 8vw;}
  
  .download_logo > figure {width: 100%;}
  
  .download_logo ul > li:not(:last-child) {margin-bottom: 1.34vw;} 
  
  .download_banner img {margin: 0 auto 2.67vw;}
  
  .download_banner input { margin-top: 2.67vw;}
}



/*===== ■6. Media Partner Page =====*/
#etc_partner .partner_logo {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px dotted #999;
}

#etc_partner .partner_logo li {
  display: flex;
  align-items: center;
  max-width: 120px;
  margin: 5px;
  padding: 10px;
  background: #fff;
}

#etc_partner .partner_logo li a {
  display: block;
  width: 100%;
  margin: 0 auto;
  line-height: 0;
}
#etc_partner .partner_logo li img { width: 100%;}

#etc_partner .partner_info { margin-bottom: -20px;}

#etc_partner .partner_info::after {
  width: calc(33.33% - 15px);
  content:"";
}

#etc_partner .partner_info li {
  margin-bottom: 20px;
  padding: 15px;
  background: rgba(255, 255, 255, .5);
}

#etc_partner .partner_info li div { display: flex;}

#etc_partner .partner_info li div figure {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 120px;
  min-height: 160px;
  margin: 0 10px 10px 0;
  padding: 5px;
  background: rgba(255, 255, 255, .5);
}

#etc_partner .partner_info li div figure span { min-height: 0%;}

#etc_partner .partner_info li div figure span img {width: 100%;}

#etc_partner .partner_info figcaption {
  min-height: 0%;
  margin-top: 5px;
}

#etc_partner .partner_info li div p {
  flex: 1;
  margin-bottom: 10px;
}

#etc_partner .partner_info div { flex: 1;}

#etc_partner .partner_info dl:not(:last-of-type) { margin-bottom: 10px;}
  
#etc_partner .partner_info dl * {
  font-size: 1.4rem;
  line-height: 1.3;
}

#etc_partner .partner_info dt {
  margin-bottom: 5px;
  padding: 5px;
  background: #000;
  border-radius: 3px;
  color: #fff;
  text-align: center;
}

#etc_partner .partner_info dd {
  flex: 1;
  margin: 0 0 0 5px;
}


@media (max-width: 768px) {
  #etc_partner .partner_logo {
    justify-content: flex-start;
    margin-bottom: 2.67vw;
    padding-bottom: 2.67vw;
  }
  
  #etc_partner .partner_logo li {
    width: calc(33.33% - 2.68vw);
    max-width: none;
    margin: 1.34vw;
    text-align: center;
  }
  
  #etc_partner .partner_info { margin-bottom: -2.67vw;}

  #etc_partner .partner_info li {
    margin-bottom: 2.67vw;
    padding: 2.67vw;
  }
  
  #etc_partner .partner_info li div { display: block;}
  
  #etc_partner .partner_info li div figure {
    display: block;
    width: auto;
    min-height: inherit;
    margin: 0 0 2.67vw;
    padding: 2.67vw;
    text-align: center;
  }
  
  #etc_partner .partner_info li div span {
    display: block;
    width: 50%;
    margin: 0 auto;
  }

  #etc_partner .partner_info li div figcaption {
    width: 25%;
    margin: 1.34vw auto;
  }
  
  #etc_partner .partner_info li div p { margin-bottom: 2.67vw;}  
  
  #etc_partner .partner_info dl { flex-direction: column;}
  #etc_partner .partner_info dl:not(:last-of-type) { margin-bottom: 2.67vw;}

  #etc_partner .partner_info dt {
    flex: 1;
    width: auto;
    margin-bottom: 2.67vw;
    padding: 1.34vw;
  }

  #etc_partner .partner_info dd {
    flex: 1;
    margin: 1.34vw 0 1.34vw 1.34vw;
  }
}



/*===== ■7. Corona Page =====*/

#etc_corona h2 b {
  margin-bottom: 130px;
}

#etc_corona h2 + p {
  position: absolute;
  top: 190px;
  left: 50%;
  width: 90%;
  transform :translate(-50%, -50%);
  color: #c00;
  font-size: 2rem;
}

#etc_corona .inner dl {
  margin-bottom: 30px;
}

#etc_corona .inner dt {
  margin-bottom: 15px;
}

#etc_corona .inner dl.li-mr dd {
  margin-left: 20px;
}

#etc_corona .inner dd li {
  margin-bottom: 10px;
  text-indent: -3em;
   padding-left: 3em;
}

#etc_corona .inner dl.li-mr dd li {
  text-indent: -1em;
  padding-left: 1em;
}

#etc_corona .inner p {
  margin: 0 0 30px;
}

#etc_corona .inner p:last-child {
  margin-bottom: 10px;
}

#etc_corona .inner p span.notice {
  font-size: 1.4rem;
}


@media (max-width: 768px) {
  
  #etc_corona h2 b {
    margin-bottom: 37.34vw;
  }
  
  #etc_corona h2 + p {
    width: 100%;
    padding: 2.67vw;
    top: 40vw;
    font-size: 1.4rem;
  }
  
  #etc_corona .inner dl {
    margin-bottom: 4vw;
  }

  #etc_corona .inner dt {
    margin-bottom: 4vw;
  }

  #etc_corona .inner dd li {
    margin-bottom: 2.67vw;
  }
  
  #etc_corona .inner dd li:last-child {
    margin-bottom: 0;
  }

  #etc_corona .inner p {
    margin: 0 0 8vw;
  }

  #etc_corona .inner p:last-child {
    margin-bottom: 2.67vw;
  }
  
  
}




/*===== ■8. Appointment Page =====*/

#etc_appointment tbody th,
#etc_appointment tbody td {
  font-size: 1.6rem; 
  text-align: left;
}

#etc_appointment thead th {
  width: 20%;
}

#etc_appointment thead th:last-child {
  width: 50%;
}

#appointment_about {
  margin: 40px 0 0;
  padding: 20px;
  background: #fff;
}

#appointment_about .inner > p {
  text-align: center;
}

#appointment_about .inner > p:first-child {
  margin-bottom: 20px;
}

#appointment_about .inner > p + p {
  margin-bottom: 20px;
}

#appointment_about .inner > p > b {
  display: block;
  color: #d71518;
  font-weight: bold;
  font-size: 2.4rem;
}

#appointment_about .inner > p > em {
  font-weight: bold;
  font-size: 2.0rem;
}

#appointment_domestic .inner > p,
#appointment_overseas .inner > p {
  margin-bottom: 20px;
  text-align: center;
}

#appointment_steps h2 + .inner > dl {
  counter-increment: step;
}

#appointment_steps h2 + .inner > dl dt{
  margin-bottom: 10px;
  font-size: 2.0rem;
}

#appointment_steps h2 + .inner > dl dt::before {
  display: inline-block;
  width: 60px;
  padding: 10px;
  border-radius: 3px;
  background: #333;
  color: #fff;
  font-weight: 600;
  font-size: 1.6rem;
  line-height: 1;
  text-align: center;
  content: "STEP0" counter(step);
}

#appointment_steps h2 + .inner > dl {
  margin-bottom: 20px;
}

#appointment_steps h2 + .inner > dl dd > span{
  display: block;
  padding-left: 1.2rem;
  text-indent: -1.2rem;
}



@media (max-width: 768px) {
  #etc_appointment .table_scroll {
    white-space: normal;
  }
  
   #etc_appointment .table_scroll table {
    width: 100%;
  }
  
  #appointment_about {
    margin-bottom: 8vw;
    padding: 5.34vw 2.67vw;
  }
  
  #appointment_about .inner > p + p {
    margin-bottom: 2.67vw;
  }
  
  #etc_appointment thead th {
    font-size: 1.4rem;
    -webkit-text-size-adjust: 100%;
  }
  
  #etc_appointment thead th {
    width: 30vw;
  }
  #etc_appointment thead th:first-child {
    width: 50vw;
  }
  #etc_appointment thead th:last-child {
    width: 70vw;
  }
  
  #etc_appointment tbody th, 
  #etc_appointment tbody td {
    padding: 2.67vw;
    font-size: 1.4rem;
    -webkit-text-size-adjust: 100%;
  }
  
  #appointment_about .inner > p {
    text-align: left;
  }
  
  #appointment_about .inner > p > b {
    text-align: center;
    font-size: 1.8rem;
  }
  
  #appointment_about .inner > p > em {
    font-weight: bold;
    font-size: 1.4rem;
  }
  
  #appointment_about .inner > p:first-child {
    margin-bottom: 2.67vw;
  }
  
  #appointment_domestic .inner > p, 
  #appointment_overseas .inner > p {
    margin-bottom: 2.67vw;
    text-align: left;
  }
  
  #appointment_steps h2 + .inner > dl {
    margin-bottom: 2.67vw;
  }
  
  #appointment_steps h2 + .inner > dl dt {
    margin-bottom: 1.34vw;
    font-size: 1.6rem;
  }
  
  #appointment_steps h2 + .inner > dl dt::before {
    display: inline-block;
    width: auto;
    padding: 1.34vw 2.67vw;
    border-radius: 5px;
    font-size: 1.6rem;
  }
}




/*===== ■8. Smart Decoration Page =====*/
/*intro*/
#etc_smart #smart_intro .inner > p:first-child span{
  font-size: 2rem;
}

#etc_smart #smart_intro .inner > div {
  margin-bottom: 30px;
  background: #fff;
} 

#etc_smart #smart_intro .inner > ul {
  justify-content: flex-start;
  margin: 20px 0 30px;
} 

#etc_smart #smart_intro .inner > ul li {
  padding: 10px;
  margin-bottom: 10px;
  background: #fff;
} 

#etc_smart #smart_intro .inner > ul li:not(:nth-child(4n+ 1)) {
    margin-left: 10px;
}

#etc_smart #smart_intro .inner > p:first-of-type {
  font-size: 3rem;
} 

#etc_smart #smart_intro .inner > p {
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
} 

#etc_smart #smart_intro .inner > p span {
  font-size: 3rem;
  color: #c00;
} 

#etc_smart #smart_intro .inner > p:nth-of-type(2){
  margin-bottom: 20px;
  font-size: 3rem;
} 

#etc_smart #smart_intro .inner div ul {
  margin: 0 40px 10px;
}

#etc_smart #smart_intro .inner div p {
  padding: 20px;
  text-align: center;
  font-weight: bold;
  font-size: 2rem;
}

#etc_smart #smart_intro .inner div li {
  padding: 20px;
  border: 1px solid #333;
}

#etc_smart #smart_intro .inner div span {
  display: block;
  padding: 0 40px 10px 0;
  text-align: right;
  font-size: 1.2rem;
}

#etc_smart #smart_intro .underline {
  background:#c00;
  font-size: 2rem;
  color: #fff;
}

/*detail*/
#etc_smart #smart_detail dl:not(:last-child){
  margin-bottom: 40px;
}

#etc_smart #smart_detail ul {
  justify-content: center;
}

#etc_smart #smart_detail li{
  width: 30%;
}

#etc_smart #smart_detail li:before{
  position: absolute;
  top: 0;
  left: 50%;
  color: #fff;
  width: 100%;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateX(-50%);
  background: #c00;
  font-weight: bold;
}

#etc_smart #smart_detail li:not(:first-child){
  margin-left: 20px;
}

/*point*/
#etc_smart #smart_detail #point li{
  position: relative;
  padding: 60px 30px 20px;
  text-align: center;    
  background: rgba(255, 255, 255, .5);
  counter-increment: num;
}


#etc_smart #smart_detail #point li em {
  display: block;
  margin-bottom: 10px;
  font-size: 2rem;
  font-weight: bold;
}

#etc_smart #smart_detail #point li span {
  display: block;
}

#etc_smart #smart_detail #point li:before{
  content: "POINT 0" counter(num);
}

/*plan*/
#etc_smart #smart_detail #plan dd{
  margin-bottom: 30px; 
}

#etc_smart #smart_detail #plan figure{
  margin-bottom: 10px;
  text-align: center;
}
#etc_smart #smart_detail #plan ul {
  margin-bottom: 10px;
}

#etc_smart #smart_detail #plan li {
  position: relative;
  padding: 60px 30px 20px;    
  background: rgba(255, 255, 255, .5);
  counter-increment: num;
}
  

#etc_smart #smart_detail #plan li > em {
  display: block;
  font-weight: bold;
  font-size: 2rem;
  text-align: center;
}

#etc_smart #smart_detail #plan dd > p {
  font-size: 1.2rem;
  text-align: right;
}

#etc_smart #smart_detail #plan li:before{
  content: "PLAN 0" counter(num);
}

@media(max-width: 768px) {
  /*intro*/
  
  #etc_smart #smart_intro .inner > p:first-of-type {
    font-size: 1.8rem;
  }
  
  #etc_smart #smart_intro .inner > p {
    font-size: 1.4rem;
  } 

  #etc_smart #smart_intro .inner > p span {
    font-size: 1.6rem;
  } 
  #etc_smart #smart_intro .underline {
    font-size: 1.4rem;
  }

  #etc_smart #smart_intro .inner > span {
    margin-bottom: 2.34vw;
  }
  
  #etc_smart #smart_intro .inner > div {
    margin-bottom: 4vw;
  }
  
  #etc_smart #smart_intro .inner > ul {
    margin: 1.34vw 0 4vw;
  }
  
  #etc_smart #smart_intro .inner > ul li:not(:nth-child(4n+ 1)) {
    margin-left: 0;
  }
  
  #etc_smart #smart_intro .inner > ul li {
    margin-bottom: 1.34vw;
    padding: 1.34vw;
  }
  
  #etc_smart #smart_intro .inner div ul {
    margin: 0 2.67vw 1.34vw ;
  }
  
  #etc_smart #smart_intro .inner div li {
    margin-bottom: 1.34vw;
    padding: 2.67vw;
  }
  
  #etc_smart #smart_intro .inner div p {
    padding: 2.34vw;
    font-size: 1.4rem;
  }
  
  #etc_smart #smart_intro .inner div span {
    padding: 0 2.34vw 2.34vw 0;
  }
  
  #etc_smart #smart_intro .inner > p:nth-of-type(2) {
    margin-bottom: 2.67vw;
    font-size: 1.6rem;
  }
  
  /*detail*/
  #etc_smart #smart_detail dl:not(:last-child){
    margin-bottom: 8vw;
  }

  #etc_smart #smart_detail li{
    width: 100%;
  }

  #etc_smart #smart_detail li:before{
    height:5.34vw;
  }

  #etc_smart #smart_detail li:not(:first-child){
    margin-left: 0;
  }

  #etc_smart #smart_detail li:not(:last-child){
    margin-bottom: 1.3vw;
  }

  /*point*/
  #etc_smart #smart_detail #point li{
    padding: 8vw 2.67vw 2.67vw;
  }


  #etc_smart #smart_detail #point li em {
    margin-bottom: 1.3vw;
    font-size: 1.6rem;
  }

  /*plan*/
  #etc_smart #smart_detail #plan dd{
    margin-bottom: 2.67vw; 
  }

  #etc_smart #smart_detail #plan figure{
    margin-bottom: 1.34vw;
  }
  
  #etc_smart #smart_detail #plan ul {
    margin-bottom: 1.34vw;
  }

  #etc_smart #smart_detail #plan li {
    padding: 8vw 2.67vw 2.67vw;
  }
  
  #etc_smart #smart_detail #plan dd > p {
    text-align: left;
    text-indent: -1rem;
    padding-left: 1rem;
  }
  
  #etc_smart #smart_detail #plan li > em {
    font-size: 1.6rem;
  }
  
  #etc_smart #smart_detail #smart_btn a:not(:last-child) {
    margin-bottom: 1.34vw;
  }
}


/*===== ■10. Seminar Information Page =====*/

#seminar-information h1 em {
  font-size: 2.6rem;
  padding-top: 10px;
}

#seminar-information h1 em {
  font-size: 2.6rem;
  padding-top: 10px;
}

#seminar-information .label {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  width: 60px;
  padding: 5px 10px;
  border-radius: 3px;
  margin-right: 5px;
  background: #666;
  color: #fff;
  font-weight: bold;
}
#seminar-information .label + div{
  width: 100%;
}
#seminar-information .photo {
  display: block;
  width: 10%;
  min-width: 100px;
  margin-bottom: 10px;
}
#seminar-information .overview {
  padding-left: 5px;
  border-left: 5px solid #666;
}
#seminar-information .overview_cont {
  padding: 10px;
  background: #ccc;
  border-left: 5px solid #666;
}

/*intro*/
#seminar-information #seminarinfo_intro {
  margin: 0 20px;
  padding: 30px 20px;
  background: #fff;
}

#seminar-information .slides_wrap  {
  margin-bottom: 30px;
}
#seminar-information #seminar_slide {
  position: relative;
  margin: 0 auto;
  padding: 0 25px 10px;
  max-width: 640px;
}

#seminar-info-1120 .flex2 {
  justify-content: flex-start;
}

#seminar-information .list_num li {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
  counter-increment: num;
}

#seminar-information .list_num li::before {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-right: 5px;
  border-radius: 50%;
  background: #c00;
  color: #fff;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  content: counter(num);
}

#seminar-information .list_num li span {
  flex: 1;
}

#seminar-information dl.supplement {
  margin-bottom: 20px;
  padding: 10px;
  background: rgba(255, 255, 255, .5);
}
#seminar-information dl.supplement dt {
  margin-bottom: 10px;
  padding: 10px;
  background: #666;
  color: #fff;
  font-weight: 600;
  font-size: 1.8rem;
}
#seminar-information dl.supplement dd {
  margin: 0 10px;
}

#seminar-information table.th-25 th {
  width: 25%;
}

#seminar-information table + ul p.notice {
  font-size: 1.6rem;
}


@media(max-width: 768px) {
  #seminar-information h1 em {
    font-size: 1.8rem;
    padding-top: 1.34rem;
  }
  #seminar-information .label {
    justify-content: center;
    width: auto;
    padding: 1.34vw 2.67vw;
    margin: 0 0 1.34vw 0;
  }  
  
  /*intro*/
  #seminar-information #seminarinfo_intro {
    margin: 0 2.67vw;
    padding: 2.67vw 1.34vw;
  }
  #seminar-information .slides_wrap  {
    margin-bottom: 8vw;
  }
  #seminar-information #seminar_slide {
    padding: 0 0 10px;
  }
  #seminar-information .photo {
    min-width: 80px;
    margin-bottom: 2.67vw;
  }
  #seminar-information .overview_cont {
    padding: 2.67vw;
  }

  #seminar-information .list_num li::before {
    width: 5.34vw;
    height: 5.34vw;
    margin-right: 1.34vw;
    padding: .67vw;
    font-size: 1.2rem;
  }
  
  #seminar-information dl.supplement {
    margin-bottom: 2.67vw;
    padding: 2.67vw;
  }

  #seminar-information dl.supplement dt {
    margin-bottom: 2.67vw;
    padding: 2.67vw;
    font-size: 1.6rem;
    text-align: center;
  }
  
  #seminar-information table.th-25 th {
    width: 100%;
  }
  
  #seminar-information table + ul p.notice {
    font-size: 1.4rem;
  }
  
  #seminar-information .single {
    flex-direction: column;
    width: 100%;
  }
  #seminar-information .single > div {
    width: 100%;
  }
}


/*===== ■11. Documents Page =====*/
#etc_documents .covercard a.soon {
  position: relative;
}
#etc_documents .covercard a.soon::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3em;
  transform: translate(-50%, -50%);
  font-size: 4rem;
  color: #000;
  content: '準備中';
}


@media(max-width: 768px)  {
  #etc_documents .covercard a.soon::before {
    font-size: 2.4rem;
  }
}



/*===== ■12. Sitemap Page =====*/
#sitemap_list {
  margin: 60px auto 30px;
  padding: 0 20px
}

#sitemap_list div.inner {
  max-width: 1366px;
  margin: 0 auto;
}

#sitemap_list div.inner > div {
  position: relative;
}

#sitemap_list div.inner > div:not(:first-child) {
  padding-left: 30px;
}

#sitemap_list div.inner > div:not(:last-child):after {
  position: absolute;
  top: 0;
  left: 100%;
  margin: 0 1rem;
  content: "";
  width: 1px;
  height: 100%;
  box-shadow: 1px 0px 1px rgba(0, 0, 0, .15);
}

#sitemap_list div.inner > div > p {
  padding: 10px 0;
  line-height: 1;
}

#sitemap_list div.inner > div > p a {
  display: inline-block;
  font-size: 1.6rem;
}

#sitemap_list div.inner > div > dl {
  padding: 10px 0;
}

#sitemap_list div.inner > div > dl dt {
  font-weight: 700;
  margin-bottom: 5px;
  font-size: 1.8rem;
}

#sitemap_list div.inner > div > dl dd {
  padding-left: 10px;
  margin-bottom: 5px;
  font-size: 1.6rem;
}

@media (max-width: 768px) {
  #sitemap_list {
    margin: 8vw auto 5.33vw;
    padding: 0 2.67vw;
  }

  #sitemap_list div.inner {
    display: block;
    margin: 0;
    padding: 0 2.67vw;
  }
  
  #sitemap_list div.inner > div {
    position: static;
    width: 100%;
  }
  
  #sitemap_list div.inner > div:not(:first-child) {
    padding-left: 0;
  }
  
  #sitemap_list div.inner > div:not(:last-child):after {
    content: none;
  }
  
  #sitemap_list div.inner > div > p {
    padding: 2.67vw 0;
    line-height: 1;
  }
  
  #sitemap_list div.inner > div > p a {
    display: inline-block;
    font-size: 1.4rem;
  }
  
  #sitemap_list div.inner > div > dl {
    padding: 2.67vw 0;
  }
  
  #sitemap_list div.inner > div > dl dt {
    font-weight: 700;
    margin-bottom: 1.33vw;
    font-size: 1.6rem;
  }
  
  #sitemap_list div.inner > div > dl dd {
    padding-left: 2.67vw;
    margin-bottom: 1.33vw;
    font-size: 1.4rem;
  }
}
