@charset "utf-8";
html * {
  margin: 0;
  padding: 0;
}
html.fix {
  overflow: hidden;
}
html.fix body {
  overflow-y: scroll;
  overflow-x: hidden;
}
#hiddenCts {
  visibility: hidden;
  pointer-events: none;
  width: 100%;
}
#scrollMask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-image: linear-gradient(to top, black 91%, transparent 94%);
  mask-image: linear-gradient(to top, black 91%, transparent 94%);
}
#scrollCts {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.whl #scrollCts {
  transition: top 0.5s cubic-bezier(0.31, 0.61, 0.51, 0.97);
}
body {
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #222222;
}
main {
  position: relative;
  text-align: center;
  font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ StdN", "游ゴシック体", YuGothic,
    "游ゴシック", "Yu Gothic", "Hiragino Sans", "Meiryo", "メイリオ", sans-serif;
  font-size: 14px;
  font-feature-settings: "palt";
  letter-spacing: 0.07em;
}
li {
  list-style: none;
}
main .anm {
  opacity: 0;
}
main .anm.filterin {
  opacity: 1;
}
main .anm.mask {
  -webkit-mask-image: linear-gradient(to left, transparent 50%, black 55%);
  mask-image: linear-gradient(to left, transparent 50%, black 53%);
  -webkit-mask-position-x: 100%;
  -webkit-mask-size: 220%;
  transition: -webkit-mask-position-x 0.6s cubic-bezier(0.35, 0.13, 0.07, 1);
  transition-delay: 0.1s;
}
main .anm.mask.end {
  -webkit-mask-position-x: 0%;
}
main a {
  text-decoration: none;
}
main i,
main em {
  font-style: normal;
}
main img {
  width: 100%;
}
 {
  max-width: 1020px;
  margin: 0 auto;
  position: relative;
  width: 96%;
}
main section {
  position: relative;
}
main sup {
  vertical-align: bottom;
  margin-bottom: -0.02em;
  display: inline-block;
  font-size: 1em;
  text-indent: 0;
}
main a {
  transition: opacity 0.24s;
}
main a:hover {
  opacity: 0.7 !important;
}
main a.btnEntry,
header a.entry {
  opacity: 1 !important;
  transition: filter 0.3s;
}
main a.btnEntry:hover,
header a.entry:hover {
  filter: contrast(1.1) brightness(1.3);
}

#bg_pattern {
  position: fixed;
  left: 0;
  width: 100%;
  height: 300em;
  background: url(../img/bg_pictanm.png) center top;
  background-size: 100vw;
}
.whl #bg_pattern {
  transition: top 0.8s cubic-bezier(0.43, 0.7, 0.58, 0.96);
}
#bg_slit {
  background: url(../img/bg_slit2.png) center top;
  position: fixed;
  width: 100%;
  height: 100%;
  background-size: 100vw; /* width: 90%; */ /* left: 5%; */
  height: 84%;
  top: 10%;
  opacity: 0;
}
header {
  position: fixed;
  width: 100%;
  z-index: 1;
  font-family: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ StdN", "游ゴシック体", YuGothic,
    "游ゴシック", "Yu Gothic", "Hiragino Sans", "Meiryo", "メイリオ", sans-serif;
  z-index: 2;
}
header .logo {
  padding: 1.88em 3.25em;
  display: inline-block;
  filter: drop-shadow(0.1rem 0.1rem 0 #222222);
}
header .logo img {
  width: 49vw;
  max-width: 49vw;
}
header .mypage {
  position: absolute;
  right: 5.55em;
  top: 0;
  z-index: 1;
}
header .mypage a {
  display: block;
  padding: 2em 1.5em;
  filter: drop-shadow(2px 2px 0 #222222);
  transition: 0.25s;
}
header .mypage a:hover {
  opacity: 0.7;
}
header .openBtn {
  position: absolute;
  right: 0;
  top: 0;
  width: 5.6em;
  height: 5.7em;
  /* background: #f0f; */
  text-align: center;
  padding: 1.66em 0.8em;
  box-sizing: border-box;
  line-height: 0;
  background: #222222;
  z-index: 1;
  transition: 0.25s;
  cursor: pointer;
}

header .openBtn span {
  display: inline-block;
  width: 1em;
  height: 2px;
  margin-bottom: 0.95em;
  width: 2.25em;
  background: white;
  position: relative;
  transition: transform 0.3s cubic-bezier(0.03, 0.5, 0.25, 1),
    top 0.6s cubic-bezier(0.61, 0, 0.14, 0.9), opacity 0.5s, wide 0.2s;
  top: 0;
}
header.open .openBtn {
  background: #fff;
}
header.open .openBtn span {
  background: #222222;
  transition: top 0.3s cubic-bezier(0.03, 0.5, 0.25, 1),
    transform 0.5s cubic-bezier(0.73, -0.02, 0.27, 0.8), opacity 0.5s, wide 0.2s;
}
header.open .openBtn span:nth-child(1) {
  transform: rotate(45deg);
  top: 1.1em;
}
header.open .openBtn span:nth-child(2) {
  transform: scaleX(0);
  opacity: 0;
}
header.open .openBtn span:nth-child(3) {
  transform: rotate(-45deg);
  top: -1.053em;
}
header nav {
  right: 0;
  transform: translateX(100%);
  position: absolute;
  width: 22.95em;
  height: 100vh;
  top: 0;
  background: #222222;
  color: #fff;
  display: block;
  padding: 14.1vh 2.5em 0 2.9em;
  box-sizing: border-box;
  font-size: 0.875em;
  transition: transform 0.55s cubic-bezier(0.3, 0.03, 0.08, 0.92);
}
header.open nav {
  transform: translateX(0%);
}
header nav a {
  display: block;
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 1.72em;
  margin-bottom: 3.45vh;
  white-space: nowrap;
  transition: opacity 0.3s;
}
header nav a:hover {
  opacity: 0.7;
}
header nav a.entry {
  position: absolute;
  bottom: 0;
  background: #ff1b46;
  color: #fff;
  width: 75%;
  font-size: 1.4em;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  padding: 1em 0;
  margin: 3.65em 0 2.1em;
}
header nav a.entry.end {
  background: #686777;
  pointer-events:none;
}
main {
  text-align: left;
  /* min-height: 2000em; */
}
main .ctsInner {
  width: 90%;
  margin: 0 auto;
  max-width: 1366px;
}
main .cts {
  position: relative;
  box-sizing: border-box;
  padding: 4.2em;
  width: 100%;
  background: #fff;
  margin-bottom: 20.6%;
}
main .cts h2 {
  background: #222;
  color: #fff;
  position: absolute;
  left: 0;
  top: 0;
  font-size: 3.2em;
  font-weight: 500;
  padding: 0.08em 0.4em 0.28em 0.5em;
  line-height: 1.4;
  letter-spacing: 0.12em;
  margin: -1.1em 0 0 -0.45em;
}

/*============================
#ctsMv
============================*/
#ctsMv {
  position: relative;
  height: 100vh;
}
#ctsMv h1 {
  display: inline-block;
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -49.4%);
  width: 100%;
  max-width: 34.286em;
  opacity: 0.01;
}
#ctsMv .scroll {
  position: absolute;
  bottom: 0;
  left: 50%;
  opacity: 0;
  transition: 0.7s cubic-bezier(0.33, 0.16, 0.39, 0.91);
}
#ctsMv .scroll img {
  display: block;
  width: 3.7em;
  transform: translateX(-50%);
  margin-bottom: 1em;
}
#ctsCover {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #ffffff;
  pointer-events: none;
}
@keyframes scorllatt {
  0% {
    background-position-y: 200%;
  }
  100% {
    background-position-y: 0%;
  }
}

#ctsMv .scroll span {
  width: 2px;
  height: 4.4em;
  display: block;
  background: linear-gradient(0deg, white 50%, transparent 0);
  background-size: 100% 200% !important;
  background-position-y: 200%;
}

#ctsMv .scroll.animate span {
  animation: scorllatt 1.5s cubic-bezier(0.57, 0.11, 0.21, 0.9) infinite;
}

#ctsMv .scroll.out {
  opacity: 0 !important;
  transform: translateY(-4em);
  transition: 0.7s cubic-bezier(0.45, 0.07, 0.42, 0.97);
}

/*============================
#ctsLead
============================*/
#ctsLead {
  padding: 26.4em 2.1em 0;
}
#ctsLead .filterin {
  padding-bottom: 30em;
}
#ctsLead h2 {
  display: inline;
  color: #000000;
  font-size: 5.66em;
  line-height: 1.77;
  letter-spacing: 0.1em;
  font-weight: 500;
  position: relative;
}
#ctsLead h2 span {
  background: linear-gradient(to right, white 85%, transparent 0);
  background-size: 120% 100%;
  background-position: -0.75em 0;
  padding: 0.02em 0 0.12em 0.15em;
  display: inline-block;
  line-height: 0.9;
  position: relative;
}
#ctsLead .lead {
  padding: 18em 0 20.8em;
}
#ctsLead .lead p {
  font-size: 2.2em;
  font-weight: 500;
  margin-bottom: 5em;
  line-height: 2.6;
  color: #000000;
  background: linear-gradient(to top, white 88%, transparent 0);
  display: inline;
  letter-spacing: 0.08em;
  padding: 0 0.3em 0 0.7rem;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.mac #ctsLead .lead p{
  font-weight: 400;
  background: linear-gradient(to top, white 93%, transparent 0);
}
.ios #ctsLead .lead p{
  background: linear-gradient(to top, white 93%, transparent 0);
}
#ctsLead .lead .last {
  margin-top: 9.3em;
}
#ctsLead .lead .last p {
  font-size: 3.2em;
  letter-spacing: 0.11em;
  line-height: 2.66;
  padding: 0 0em 0 0.7rem;
}
#ctsLead .lead span {
  display: block;
  margin-bottom: 5.7em;
}

/*============================
#ctsDentsuLabTokyo
============================*/
#ctsDentsuLabTokyo{
  padding: 4.4em 15.572em 6.05em;
  margin-bottom: 63.8em;
}
#ctsDentsuLabTokyo h2{
  background: #ff1b46;
  color: #000000;
}
#ctsDentsuLabTokyo .dlt_img {
  width: 80.646%;
  padding: 2em 0 1.6em;
  margin-left: -0.85em;
}
#ctsDentsuLabTokyo p.lead {
  font-size: 1.36em;
  font-size: max(1.36em, 13px);
  line-height: 2.1;
  margin-top: 1.1em;
  font-weight: 500;
  width: 102%;
}
#ctsDentsuLabTokyo p.lead + p{
  margin-top: 2.15em;
}
#ctsDentsuLabTokyo .more {
  display: block;
  width: 100%;
  height: 5em;
  background-color: #000;
  color: white;
  text-align: center;
  font-size: 1.36em;
  line-height: 5em;
  font-weight: 500;
  margin-top: 4em;
}

/*============================
#ctsLecturers
============================*/
#ctsLecturers{
  padding: 4.2em 9.5em 5.8em;
  margin-bottom: 63.8em;
}
#ctsLecturers h2{
  background: #ff1b46;
  color: #000000;
  font-size: 3.2em;
  font-weight: 500;
  margin: -1.07em 0 0 -0.45em;
  padding: 0.09em 0.44em 0.25em 0.55em;
}
#ctsLecturers p.lead {
  font-size: 1.36em;
  font-size: max(1.36em, 13px);
  line-height: 2.1;
  margin-top: 1.1em;
  font-weight: 500;
}
#ctsLecturers ul + p.lead{
  margin-top: 0.5em;
}
#ctsLecturers .filterin {
  position: absolute;
  margin-top: -45em;
}
#ctsLecturers ul {
  display: flex;
  width: 104%;
  margin: 5.6% 0 6.8% -2%;
  justify-content: center;
  align-items: start;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 4.94em;
}
#ctsLecturers ul li {
  width: 29.092%;
  width: 22.858em;
  margin: 0.6em 0em;
}
#ctsLecturers ul li img {
  margin-bottom: 1.15em;
}
#ctsLecturers ul li .textBox {
  border-left: #33a6a6 0.3em solid;
  padding-left: 1.9em;
  padding-top: 0.3em;
  padding-bottom: 0.6em;
  min-height: 5.5em;
}
#ctsLecturers .lecturers li .textBox {
  min-height: 5.1em;
}
#ctsLecturers ul li .textBox h4 {
  font-size: 1.4em;
  font-weight: 400;
  margin-bottom: 0.34em;
}
#ctsLecturers ul li .textBox h3 {
  font-size: 1.67em;
  font-weight: 400;
  display: flex;
  align-items: center;
}

#ctsLecturers ul li a.more {
  background: #000;
  display: block;
  margin-top: 1.4em;
  text-align: center;
}
#ctsLecturers ul li a.more img {
  display: inline-block;
  width: 28%;
  padding: 0.98em 0;
  margin: 0;
  vertical-align: bottom;
}
#ctsLecturers ul li .textBox.col1 {
  border-color: #ff1b46;
}
#ctsLecturers ul li .textBox.col2 {
  border-color: #ff1b46;
  padding-bottom: 0.18em;
}
#ctsLecturers ul li .textBox.col3 {
  border-color: #ff1b46;
  padding-bottom: 0.1em;
}
#ctsLecturers ul li .textBox.col4 {
  border-color: #ff1b46;
  padding-bottom: 0.1em;
}
#ctsLecturers ul li .textBox .lecture_tit {
  display: flex;
  align-items: self-end;
  margin-bottom: 0.8em;
}
#ctsLecturers ul li .textBox .lecture_tit img{
  width: 12.7em;
  padding-left: 0.1em;
  margin-bottom: 0.3em;
}
#ctsLecturers ul li .textBox .lecture_tit h4{
  font-size: 1.4em;
  font-weight: 400;
  margin-bottom: 0.14em;
  margin-left: 1rem;
}

#ctsLecturers ul li .textBox h3 small {
  font-size: 0.7em;
  vertical-align: middle;
  margin-right: 1.23em;
  letter-spacing: 0;
  margin-top: 0.1em;
}
#ctsLecturers ul li .textBox.col3 img {
  width: 11.8em;
  padding-left: 0.3em;
  margin-bottom: 0.4em;
  margin-right: -0.4em;
}
#ctsLecturers ul li .textBox.col4 img {
  width: 8.2em;
  padding-left: 0em;
  margin-bottom: 0.4em;
  margin-right: -0.8em;
}



/*============================
#ctsPrincipal
============================*/
#ctsPrincipal {
  margin-bottom: 74em;
}
#ctsPrincipal p.lead {
  font-size: 1.36em;
  font-size: max(1.36em, 13px);
  line-height: 2.1;
  margin-top: 1.1em;
  font-weight: 500;
}
#ctsPrincipal ul {
  display: flex;
  width: 89.7%;
  margin: 5.6% auto 3.6%;
  justify-content: space-between;
  align-items: start;
}
#ctsPrincipal ul li {
  width: 22.326%;
}
#ctsPrincipal ul li img {
  margin-bottom: 1.15em;
}
#ctsPrincipal ul li .textBox {
  border-left: #686777 0.3em solid;
  padding-left: 1.9em;
  padding-top: 0.3em;
  min-height: 9.7em;
}
#ctsPrincipal ul li .textBox h4 {
  font-size: 1.37em;
  font-weight: 400;
  margin-bottom: 0.34em;
}
#ctsPrincipal ul li .textBox h3 {
  font-size: 1.64em;
  font-weight: 400;
  display: flex;
  align-items: center;
}
#ctsPrincipal ul li a.more {
  background: #000;
  display: block;
  margin-top: 1.4em;
  text-align: center;
}
#ctsPrincipal ul li a.more img {
  display: inline-block;
  width: 38.1%;
  padding: 0.95em 0;
  margin: 0;
  vertical-align: bottom;
}
#ctsPrincipal ul li.lecture3 {
  width: 70.5%;
  margin-top: 0;
}
#ctsPrincipal ul li.lecture3 span.photos {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.25em;
}
#ctsPrincipal ul li.lecture3 span.photos img {
  width: 31.668%;
}

#ctsPrincipal ul li.lecture3 .textBox.col2 img {
  width: 27.74em;
  margin-bottom: 0.35em;
}
#ctsPrincipal ul li.lecture3 .textBox.col2 h4 {
  margin-bottom: 1.55em;
}

/*============================
#ctsAboute
============================*/
#ctsAboute {
  background: #222222;
  color: #fff;
  padding: 2.6em 2.2em 0.4em 4.2em;
  margin-bottom: 21.4%;
}
#ctsAboute .filterin {
  position: absolute;
  margin-top: -50em;
}
#ctsAboute h2 {
  position: relative;
  margin: 0 0 0.1em;
  padding: 0;
  margin-left: -0.38em;
  font-size: 2.85em;
  letter-spacing: 0;
  font-weight: 400;
}
#ctsAboute .flex {
  display: flex;
}
#ctsAboute .flex > div:first-child {
  width: 53.3%;
}
#ctsAboute .flex div h3 {
  font-weight: 400;
  font-size: 1.37em;
  margin-bottom: 0.55em;
  margin-top: 2.1em;
  position: relative;
}
#ctsAboute .flex div h3.mt1{
  margin-top: 3em;
}
#ctsAboute .flex div h3.mt2{
  margin-top: 3em;
}
#ctsAboute .flex div h3:before {
  content: "";
  background: #686777;
  width: 0.25em;
  height: 70%;
  margin: 0.25em 0 0 -0.8em;
  display: block;
  position: absolute;
}
#ctsAboute .flex div p + h3 {
  margin-top: 2.55em;
}
#ctsAboute .flex div p {
  font-size: 2.05em;
  margin-bottom: 0.55em;
}
#ctsAboute .flex div p .mr1{
  margin: 0 0.16em;
}
#ctsAboute .flex div p.lead {
  margin-top: 0.85em;
  margin-bottom: 1.05em;
  line-height: 1.4;
}
#ctsAboute .flex div p.step {
  line-height: 1.76;
  margin-top: -0.1em;
  margin-bottom: 0.45em;
}
#ctsAboute .flex div p.step small{
  font-size: 0.84em;
  letter-spacing: 0;
}
#ctsAboute .flex div p.info {
  line-height: 1.76;
  margin-top: -0.4em;
  margin-bottom: 0.45em;
}
#ctsAboute .flex div small {
  font-size: 0.93em;
  line-height: 1.65;
  margin-bottom: 4.2em;
  display: block;
  letter-spacing: 0.08em;
}
#ctsAboute .flex div p small {
  display: inline-block;
  font-size: 0.67em;
  margin-right: 1em;
  margin-bottom: 0;
}

#ctsAboute .flex div p small a.mailLink {
  color: #fff;
  margin-left: 2em;
  display: inline;
  font-size: 1.06em;
}
#ctsAboute .flex div a.btnEntry {
  background: #ff1b46;
  color: #fff;
  width: 27.6em;
  font-size: 1.45em;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  padding: 1em 0;
  margin-top: 8.6em;
  margin-left: -2.7%;
}
#ctsAboute .flex div a.btnEntry.end {
  background: #686777;
  pointer-events:none;
}
/*============================
#ctsBanner
============================*/
#ctsBanner .banner{
  max-width: 66.429em;
  display: flex;
  justify-content: space-between;
  margin: -10em auto 10.7em auto;
  transition:filter .3s;
}
#ctsBanner .banner:hover{
  filter: contrast(.75) brightness(1.25);
  opacity: 1 !important;
}
#ctsBanner .banner img{
  width: 18.429em;
}
#ctsBanner .banner .banner_txt{
  width: 47.143em;
  background-color: #4AFF76;
  display: flex;
  align-items: center;
  justify-content: center;
}
#ctsBanner .banner .banner_txt p{
  color: #000;
  font-size: 1.36em;
  font-size: max(1.36em, 13px);
  font-weight: 500;
}

/*============================
#ctsSchedule
============================*/
#ctsSchedule {
  background: #222;
  color: #fff;
  padding: 3.1em 3.6em 5.2em 3.7em;
  margin-bottom: 15.4%;
  font-size: 0.83em;
}
#ctsSchedule h2 {
  position: relative;
  margin: 0 0 1.2em;
  padding: 0;
  margin-left: 0;
  font-size: 3.45em;
  letter-spacing: 0;
  font-weight: 400;
}
#ctsSchedule .schedule {
  display: flex;
  justify-content: space-between;
  margin-bottom: 3.6%;
}
#ctsSchedule .schedule li {
  position: relative;
  background: #fff;
  width: 12.489%;
  min-height: 13.8em;
  text-align: center;
  color: #000;
}
#ctsSchedule .schedule li:after {
  content: "";
  background: #fff;
  width: 2.7em;
  height: 0.35em;
  right: 0;
  top: 50%;
  margin: -0.15em -2.6em 0 0;
  display: block;
  position: absolute;
}
#ctsSchedule .schedule li:last-child:after {
  display: none;
}
#ctsSchedule .schedule li h3 {
  margin: 11.5% 0 2%;
}
#ctsSchedule .schedule li h3 img {
  height: 2.47em;
  width: auto;
}
#ctsSchedule .schedule li h4 {
  font-size: 1.27em;
  font-weight: 500;
  position: relative;
  padding-bottom: 1.7em;
}
#ctsSchedule .schedule li h4:after {
  content: "";
  background: #ff1b46;
  width: 1.7em;
  height: 0.2em;
  left: 50%;
  top: 0;
  margin: 2.05em 0 0 -0.85em;
  display: block;
  position: absolute;
}
#ctsSchedule .schedule li h4.col2:after {
  background: #43FF3B;
}
#ctsSchedule .schedule li h4.col3:after {
  background: #ffe74d;
}
#ctsSchedule .schedule li p {
  font-size: 1.22em;
  line-height: 1.35;
  font-weight: 500;
  letter-spacing: 0.03em;
}
#ctsSchedule .schedule li .sche_space {
  margin-top: 1.45em;
}
#ctsSchedule .schedule li p sup {
  font-size: 0.74em;
  display: inline-block;
  vertical-align: bottom;
  margin: 0px -2.4em 0.5em 0.3em;
}
#ctsSchedule small.note {
  display: block;
  font-size: 1.12em;
  font-size: max(1.12em, 11px);
  line-height: 1.6;
}

/*============================
#ctsEntry
============================*/
#ctsEntry {
  background: #222;
  color: #fff;
  padding: 4.4em 1.7em 5.1em 3.8em;
  margin-bottom: 15.4%;
  width: 70.3%;
  width: 86.059em;
  font-size: 0.83em;
}
#ctsEntry h2 {
  position: relative;
  margin: 0 0 0.85em;
  padding: 0;
  font-size: 3.4em;
  letter-spacing: 0;
  font-weight: 400;
}
#ctsEntry p.theme {
  line-height: 1.7;
  font-size: 2.5em;
}
#ctsEntry ul {
  margin: 2.4em 0 1em;
  font-size: 1.62em;
  line-height: 1.7;
  letter-spacing: 0.06em;
}

#ctsEntry ul li span {
  margin-right: 0.6em;
  color: #686777;
}
#ctsEntry .qa {
  margin: 6.2em 0 5.5em;
}
#ctsEntry .qa h3 {
  font-size: 1.97em;
  margin-top: 1.5em;
  font-weight: 400;
  margin-left: 0;
}
#ctsEntry .qa p {
  margin-top: 1.6em;
  font-size: 1.63em;
  text-indent: -1.2em;
  padding-left: 1.3em;
  line-height: 1.65;
}
#ctsEntry .qa p span {
  margin-right: 0.2em;
}
#ctsEntry h3 {
  font-weight: 400;
  font-size: 1.65em;
  margin-bottom: 0.55em;
  margin-top: 2.1em;
  position: relative;
  margin-left: 0.7em;
}
#ctsEntry h3:before {
  content: "";
  background: #686777;
  width: 0.25em;
  height: 70%;
  margin: 0.25em 0 0 -0.8em;
  display: block;
  position: absolute;
}
#ctsEntry .qa h3:before {
  display: none;
}
#ctsEntry p {
  font-size: 2.5em;
}
#ctsEntry p.date {
  margin-left: 0.5em;
  margin-bottom: 2.05em;
}
#ctsEntry ol {
  margin: 0.6em 0 1em 0.8em;
  font-size: 1.61em;
  line-height: 1.7;
  letter-spacing: 0.06em;
}
#ctsEntry ol li {
  text-indent: -1.4em;
  padding-left: 1.5em;
}
#ctsEntry ol li span {
  margin-right: 0.3em;
}
#ctsEntry ol .remarks {
  font-size: 0.685em;
  margin-left: 2em;
  padding: 0.5em 0 0.5em 1.5em;
}
@media screen and (max-width: 768px) {
  #ctsEntry ol .remarks {
    line-height: 1.6;
  }
}
#ctsEntry small {
  font-size: 1.12em;
  font-size: max(1.12em, 12px);
  margin-left: 1em;
}
#ctsEntry a.btnEntry {
  background: #ff1b46;
  color: #fff;
  width: 27.4em;
  font-size: 1.75em;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  padding: 1em 0;
  margin: 3.75em 0 0 0.7em;
}
#ctsEntry a.btnEntry.end {
  background: #686777;
  pointer-events:none;
}
/*============================
#ctsCurriculum
============================*/
#ctsCurriculum {
  background: #222;
  color: #fff;
  padding: 3.1em 3.6em 4.5em 3.7em;
  margin-bottom: 15.1%;
  font-size: 0.83em;
}
#ctsCurriculum h2 {
  position: relative;
  margin: 0 0 1.2em;
  padding: 0;
  margin-left: 0;
  font-size: 3.45em;
  letter-spacing: 0;
  font-weight: 400;
}
#ctsCurriculum .curriculum {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.6%;
}
#ctsCurriculum .curriculum li {
  position: relative;
  background: #fff;
  width: 12.55%;
  min-height: 21.5em;
  text-align: center;
  color: #000;
}
#ctsCurriculum .curriculum li:after {
  content: "";
  background: #fff;
  width: 2.7em;
  height: 0.35em;
  right: 0;
  top: 50%;
  margin: 0.75em -2.5em 0 0;
  display: block;
  position: absolute;
}
#ctsCurriculum .curriculum li:last-child:after {
  display: none;
}
#ctsCurriculum .curriculum li h3 {
  margin: 13.4% 0 2%;
}
#ctsCurriculum .curriculum li h3 img {
  height: 3.1em;
  width: auto;
}
#ctsCurriculum .curriculum li h4 {
  font-size: 1.5em;
  font-weight: 500;
  position: relative;
  padding-bottom: 2em;
}
#ctsCurriculum .curriculum li h4:after {
  content: "";
  background: #686777;
  width: 1.7em;
  height: 0.17em;
  left: 50%;
  top: 0;
  margin: 2.45em 0 0 -0.85em;
  display: block;
  position: absolute;
}
#ctsCurriculum .curriculum li h4.col2:after {
  background: #ff1b46;
}
#ctsCurriculum .curriculum li h4.col3:after {
  background: #43ff3b;
}
#ctsCurriculum .curriculum li h4.col4:after {
  background: #ffe74d;
}
#ctsCurriculum .curriculum li p {
  font-size: 1.55em;
  line-height: 1.55;
  letter-spacing: 0;
  font-weight: 500;
  line-height: 1.5;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 3em;
  flex-wrap: wrap;
}
#ctsCurriculum .curriculum li p span,
#ctsCurriculum .curriculum li p small{
  display: flex;
  align-items: center;
  height: 4.6em;
}
#ctsCurriculum .curriculum li p small{height: 5.5em;line-height: 1.2;font-size: .8em;}
#ctsCurriculum .curriculum li p .narrow {
  display: inline-block;
  transform: scaleX(0.85);
}
#ctsCurriculum .curriculum li p.l4 {
  font-size: 1.17em;
  line-height: 1.18;
  margin-top: -0.26em;
  display: block;
}
#ctsCurriculum .curriculum li p.l4 span {
  line-height: 1.1;
  display: inline-block;
  margin-bottom: 0.2em;
}
#ctsCurriculum .curriculum li p sup {
  font-size: 0.64em;
  display: inline-block;
  vertical-align: bottom;
  margin: 0 -2.4em 0.8em 0.2em;
}
#ctsCurriculum small.note {
  display: block;
  font-size: 1.12em;
  line-height: 1.6;
  font-size: max(1.12em, 11px);
}
#ctsCurriculum .term {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
#ctsCurriculum .term p{
  display: block;
  width: 49.6%;
  font-size: 1.5em;
  color: white;
  background-color: #686777;
  text-align: center;
  line-height: 1.74;
  margin-bottom: 3.6%;
}

/*============================
#ctsNotes
============================*/
#ctsNotes {
  background: #222;
  color: #fff;
  padding: 3.1em 2.3em 3.7em 3.7em;
  margin-bottom: 4.8%;
  width: 70.3%;
  width: 86.059em;
  font-size: 0.83em;
}
#ctsNotes h2 {
  position: relative;
  margin: 0 0 1.1em;
  padding: 0;
  font-size: 3.4em;
  letter-spacing: 0;
  font-weight: 400;
}
#ctsNotes p {
  font-size: 1.12em;
  font-size: max(1.12em, 12px);
  line-height: 2.14;
  margin-bottom: 2.2em;
  text-indent: -1em;
  padding-left: 1em;
}
#ctsNotes p a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

/*============================
#ctsFooter
============================*/
#ctsFooter {
  text-align: center;
  font-size: 0.83em;
}
#ctsFooter a.btnEntry {
  background: #ff1b46;
  color: #fff;
  width: 27.539em;
  font-size: 1.75em;
  letter-spacing: 0;
  display: inline-block;
  text-align: center;
  padding: 1em 0;
  margin: 3.65em 0 13em;
}
#ctsFooter a.btnEntry.end {
  background: #686777;
  pointer-events:none;
}
#ctsFooter h2 {
  width: 100%;
  display: block;
  margin-bottom: 3.2%;
}
#ctsFooter h2 img {
  display: inline-block;
  width: 9.3em;
  padding: 0.3em 0.8em;
}
#ctsFooter .share {
  display: flex;
  justify-content: center;
}
#ctsFooter .share a {
  border-radius: 50%;
  display: block;
  overflow: hidden;
  margin: 0 3.7%;
  background: #fff;
}
#ctsFooter .share a img {
  vertical-align: bottom;
  width: 12.85em;
  transition: opacity 0.24s;
}
#ctsFooter .share a:hover {
  opacity: 1 !important;
}
#ctsFooter .share a:hover img {
  opacity: 0.65;
}
#ctsFooter p.copyright {
  width: 24.5em;
  display: inline-block;
  margin: 9.6% 0 1.4%;
}
#ctsFooter .banner{
  width: 100%;
  max-width: 80.029em;
  display: flex;
  justify-content: space-between;
  margin: 11.8em auto 0em auto;
  transition:filter .3s;
}
#ctsFooter .banner:hover{
  filter: contrast(.75) brightness(1.25);
  opacity: 1 !important;
}
#ctsFooter .banner img{
  width: 22.229em;
}
#ctsFooter .banner .banner_txt{
  width: 56.8em;
  background-color: #4AFF76;
  display: flex;
  align-items: center;
  justify-content: center;
}
#ctsFooter .banner .banner_txt p{
  color: #000;
  font-size: 1.36em;
  font-size: max(1.72em, 13px);
  font-weight: 500;
  letter-spacing: 0;
}



/*============================
#modal
============================*/
#modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  z-index: 2;
}
#modal .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.8;
}
#modal .scroll {
  padding: 9em 0;
  box-sizing: border-box;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  /* scroll-behavior: smooth; */
}
#modal .cts {
  width: 89.3%;
  margin: 0 auto;
  max-width: 97.572em;
  padding: 0;
  pointer-events: all;
}
#modal .cts:before {
  content: "";
  width: 0.286em;
  height: 100%;
  position: absolute;
  left: 0;
  background: #686777;
  top: 0;
}
#modal.sel0 .cts:before {
  background: #686777;
}
#modal.sel2 .cts:before {
  background: #ff1b46;
}
#modal.sel3 .cts:before {
  background: #ff1b46;
}
#modal.sel4 .cts:before {
  background: #ff1b46;
}
#modal .cts .close {
  width: 5em;
  position: absolute;
  right: 0;
  top: 0;
  margin: 0 -5.1em 0 0;
  cursor: pointer;
  transition: filter 0.3s;
}
#modal .cts .close:hover {
  filter: contrast(0.5) brightness(1.4);
}
#modal .prof {
  font-weight: 500;
}
#modal .prof > li {
  display: none;
}
#modal .prof li .course {
  padding: 4.85em 0 0em 4.95em;
  margin-bottom: -9.9em;
}
#modal .prof li .information {
  padding: 9.15em 0 6.4em 10.25em;
}
#modal .profile {
  display: flex;
  margin: 3.6em 0 5.4em;
}
#modal .profile.nolead {
  margin: -0.6em 0 6.5em;
}

#modal .profile .photo {
  width: 14.3em;
}
#modal .profile .photo img {
  width: 100%;
}
#modal .profile .textArea {
  margin-left: 4.8%;
  width: 78.4%;
}
#modal .profile .textArea h4 {
  font-size: 1.4em;
  font-weight: 500;
  margin-bottom: 0.5em;
}
#modal .profile .textArea h3 {
  font-size: 2.8em;
  font-weight: 500;
  line-height: 1.3;
}
#modal .profile .textArea h5 {
  font-size: 1.42em;
  letter-spacing: 0.01em;
  font-weight: 500;
}
#modal .profile .textArea p.tl {
  font-size: 1.35em;
  margin: 1.7em 0 2.2em;
  letter-spacing: .06em;
}
#modal .profile .textArea p {
  font-size: 1.4em;
  line-height: 2.03;
  margin-bottom: 1em;
  letter-spacing: 0.02em;
}
#modal .profile .textArea .points {
  font-size: 1.09em;
  font-weight: 500;
  color: #686777;
  line-height: 2.1;
  letter-spacing: 0;
  margin: 1.4em 0 2.2em;
}

#modal .profile .textArea .works {
  display: flex;
}
#modal .profile .textArea .works li {
  margin-right: 1.4em;
}
#modal .profile .textArea .works li img {
  height: 11.429em;
  width: auto;
}
#modal .prof li .message {
  font-size: 1.4em;
  line-height: 2.03;
  margin-bottom: 1em;
  letter-spacing: 0.02em;
}
#modal .prof li .message p {
  margin-bottom: 2.1em;
}
#modal .prof li h2 {
  background: none;
  color: #000;
  position: relative;
  margin: 0 0 0.8em;
  padding: 0;
  line-height: 1.28;
}
#modal .prof li h2 img {
  height: 1.91em;
  width: auto;
}
#modal.sel4 .prof li h2 img {
  height: 1.78em;
  margin: .1em 0;
}
#modal .prof li h2 small {
  letter-spacing: 0;
  font-weight: 400;
  font-size: 0.82em;
}
#modal .prof li p.lead {
  font-size: 1.37em;
  line-height: 2.1;
  margin-bottom: 1.37em;
  margin-bottom: 2.1em;
}
#modal .deputy {
  background: #f7f7f7;
  padding: 7.6em 0 3em 5.1em;
  margin-top: -2.2em;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#modal .deputy > li {
  width: 48.95%;
  margin-bottom: 10em;
}
#modal .deputy > li:nth-of-type(n + 3){
  margin-bottom: 5.6em;
}
#modal .deputy li img {
  width: 11.429em;
  float: left;
  margin-right: 2.1em;
}

#modal .deputy li .textArea h4 {
  font-size: 1.38em;
  font-weight: 500;
  margin-bottom: 0.25em;
}
#modal .deputy li .textArea h3 {
  font-weight: 400;
  font-size: 2.8em;
}
#modal .deputy li .textArea h5 {
  font-size: 1.4em;
  letter-spacing: 0.01em;
  font-weight: 500;
  margin-bottom: 0.5em;
}
#modal .deputy li .textArea p.tl {
  display: inline-block;
  font-size: 1.35em;
  margin-bottom: 1.5em;
}
#modal .deputy li p {
  font-size: 1.4em;
  line-height: 2.05;
  letter-spacing: 0.022em;
}
#modal .deputy li .points {
  font-size: 1.12em;
  font-weight: 400;
  color: #686777;
  line-height: 2.03;
  letter-spacing: 0.02em;
  margin: 1.4em 0 1.7em;
}
#modal .deputy li .points li {
  width: 100%;
}
#modal .deputy li .works {
  height: 11.4285em;
  width: auto;
}

@media screen and (min-width: 769px) and (max-width: 1517px) {
  body,
  main {
    font-size: 0.92vw;
  }
  #ctsEntry,
  #ctsNotes {
    font-size: 11.6px;
  }
}

@media screen and (min-width: 769px) and (max-width: 1070px) {
  #ctsEntry,
  #ctsNotes {
    font-size: 1.07vw;
  }
}
@media screen and (min-width: 769px) {
  .forsp {
    display: none !important;
  }
  header .openBtn:hover {
    background: #4e4e4e;
  }
  header.open .openBtn:hover {
    background: #dcdcdc;
  }
}
@media screen and (max-width: 768px) {
  .forpc {
    display: none !important;
  }
  body,
  main {
    font-size: 1.75vw;
  }
  main .cpInner {
    max-width: 1020px;
    width: 96%;
  }
  main sup {
    margin-bottom: -0.02em;
    font-size: 1em;
  }

  #bg_pattern {
    height: 410em;
    background-size: 256vw;
  }
  #bg_slit {
    background-size: 256vw;
    height: 84%;
    top: 10%;
    opacity: 0;
  }
  header .logo {
    padding: 1.68em 2.45em;
    filter: drop-shadow(0.2em 0.2em 0 #222222);
  }
  header .logo img {
    width: 25.5em;
  }
  header .mypage {
    right: 5.55em;
  }
  header .mypage a {
    display: block;
    padding: 2.4em 3.1em;
    filter: drop-shadow(0.2em 0.2em 0 #222222);
  }
  header .mypage a img {
    width: 12.6em;
  }
  header .openBtn {
    width: 5.8em;
    height: 5.7em;
    padding: 1.66em 1em;
    font-size: 1.2em;
  }
  header .openBtn span {
    width: 1em;
    height: 0.13em;
    margin-bottom: 0.95em;
    width: 2.25em;
  }
  main {
    /* min-height: 2000em; */
  }
  main .ctsInner {
    width: 99.35%;
  }
  header nav {
    width: 36.5em;
    height: 100dvh;
    padding: 12.9vh 2.5em 0 3.4em;
    font-size: 0.875em;
    transition: transform 0.55s cubic-bezier(0.3, 0.03, 0.08, 0.92);
  }
  header nav a {
    font-size: 2.82em;
    margin-bottom: 3.65vh;
    transition: opacity 0.3s;
  }
  header nav a.entry {
    width: 81%;
    font-size: 2.4em;
    letter-spacing: 0;
    padding: 0.9em 0;
    margin: 3.65em 0 1.5em;
  }
  main .cts {
    padding: 3.9em;
    margin-bottom: 53.8%;
    width: 85.9%;
    margin-left: 6.9%;
  }
  main .cts h2 {
    font-size: 4.4em;
    font-weight: 500;
    padding: 0.23em 0.64em 0.48em;
    line-height: 1.4;
    letter-spacing: 0.12em;
    margin: -1.27em 0 0 -0.55em;
  }

  /*============================
	#ctsMv
	============================*/
  #ctsMv {
    height: 100vh;
    max-height: 100dvh;
  }
  #ctsMv h1 {
    transform: translate(-50.2%, -33.9%);
    width: 100%;
    max-width: 24.4em;
  }
  #ctsMv .scroll img {
    width: 5.9em;
    margin-bottom: 0.8em;
  }
  #ctsMv .scroll span {
    width: 1px;
    height: 4.4em;
  }

  /*============================
	#ctsLead
	============================*/
  #ctsLead {
    padding: 41.4em 2.1em 0;
  }
  #ctsLead .filterin {
    padding-bottom: 44.5em;
    }
  #ctsLead h2 {
    font-size: 6em;
    line-height: 1.77;
    letter-spacing: 0.1em;
    font-weight: 500;
    left: 0.2em;
    position: relative;
  }
  #ctsLead h2 span {
    background: linear-gradient(to right, white 85%, transparent 0);
    background-size: 120% 100%;
    background-position: -0.75em 0;
    padding: 0.03em 0 0.1em 0.15em;
    line-height: 0.9;
  }
  #ctsLead .lead {
    padding: 16.2em 0 25em;
    margin-left: 0.9em;
  }
  #ctsLead .lead p {
    font-size: 2.32em;
    margin-bottom: 5em;
    line-height: 2.65;
    background: linear-gradient(to top, white 86%, transparent 0);
    padding: 0 0.1rem 0 0.4rem;
    letter-spacing: 0.08em;
    white-space: now;
  }
  #ctsLead .lead .last {
    margin-top: 10.2em;
  }
  #ctsLead .lead .last p {
    font-size: 3.4em;
    letter-spacing: 0.11em;
    line-height: 2.66;
    padding: 0 0em 0 0.3rem;
    white-space: nowrap;
  }
  #ctsLead .lead span {
    margin-bottom: 5.7em;
  }

/*============================
#ctsDentsuLabTokyo
============================*/
#ctsDentsuLabTokyo{
  padding: 4.5em 3.7em 5.25em;
  margin-bottom: 158.1%;
}
#ctsDentsuLabTokyo .dlt_img {
  width: 101.646%;
  padding: 2.8em 0 0.6em;
  margin-left: -0.85em;
}
#ctsDentsuLabTokyo p.lead {
  font-size: 2.2em;
  line-height: 2.09;
  margin-top: 1.1em;
  width: 102%;
}
#ctsDentsuLabTokyo p.lead + p{
  margin-top: 1.98em;
}
#ctsDentsuLabTokyo .more {
  width: 100%;
  height: auto;
  font-size: 1.36em;
  line-height: 1.5em;
  margin-top: 2.1em;
  font-size: 2.2em;
  padding: 0.6em 0;
}

  /*============================
	#ctsLecturers
	============================*/
  #ctsLecturers{
  padding: 3.9em 3.9em 8.7em;
  margin-bottom: 76em;
  }
  #ctsLecturers h2{
  font-size: 5em;
  }
  #ctsLecturers p.lead {
    font-size: 2.2em;
    line-height: 2.07;
    margin-top: 2.8em;
  }
  #ctsLecturers .filterin {
    position: absolute;
    top: -3em;
  }
  #ctsLecturers ul {
    width: 100%;
    margin: 14.6% auto -6.9%;
    flex-wrap: wrap;
    font-size: 1.28em;
    justify-content: left;
    gap: 0 7.6%;
  }
  #ctsLecturers ul li {
    width: 46.126%;
    margin-bottom: 4.2em;
  }
  #ctsLecturers ul + ul li {
    margin-bottom: 6.5em;
  }
  #ctsLecturers ul li img {
    margin-bottom: 1.15em;
  }
  #ctsLecturers ul li .textBox {
    border-left: #33a6a6 0.37em solid;
    padding-left: 1.5em;
    padding-top: 0.3em;
    min-height: 9.7em;
  }
  #ctsLecturers ul li .textBox h4 {
    margin-bottom: 0em;
    font-size: 1.46em;
    margin-left: 0rem;
  }
  #ctsLecturers ul li .textBox h3 {
    font-size: 1.8em;
    letter-spacing: 0;
  }
  #ctsLecturers ul li .textBox h3 span.spnarrow {
    transform: scaleX(0.86);
    transform-origin: 0 0;
    width: 110%;
    white-space: nowrap;
  }
  #ctsLecturers ul li .textBox .lecture_tit{
    display: block;
  }
  #ctsLecturers ul li a.more {
    margin-top: 1.3em;
  }
  #ctsLecturers ul li a.more img {
    width: 48.1%;
    padding: 1.55em 0;
  }
  #ctsLecturers ul li .textBox.col2 img {
    width: 11.8em;
    padding-left: 0.1em;
    margin-bottom: 0.2em;
  }
  #ctsLecturers ul li .textBox.col2 h4 {
    margin-bottom: 0.5em;
    font-size: 1.66em;
    margin-left: 0rem;
  }

  #ctsLecturers ul li .textBox h3 small {
    letter-spacing: 0;
    font-size: 0.68em;
    margin-right: 0.7em;
    width: 3em;
    white-space: nowrap;
    margin-top: 0.2em;
    margin: 0.2em 0.9em 0 0em;
  }
  #ctsLecturers ul li .textBox.col3 img {
    width: 11.3em;
    padding-left: 0em;
    margin-bottom: 0.1em;
  }
  #ctsLecturers ul li .textBox.col3 h4 {
    margin-bottom: 0.55em;
    font-size: 1.6em;
    margin-left: 0;
  }
  #ctsLecturers ul li .textBox.col4 img {
    width: 7.6em;
    padding-left: 0.1em;
    margin-bottom: 0.2em;
  }
  #ctsLecturers ul li .textBox.col4 h4 {
    margin-bottom: 0.55em;
    font-size: 1.6em;
    margin-left: 0;
  }

  /*============================
	#ctsPrincipal
	============================*/
  #ctsPrincipal {
    margin-bottom: 76em;
  }
  main .cts#ctsPrincipal h2 {
    margin-top: -24.6%;
    line-height: 1.2;
    padding: 0.23em 0.52em 0.38em;
  }
  #ctsPrincipal p.lead {
    font-size: 2.2em;
    line-height: 2.1;
    margin-top: 2.7em;
  }
  #ctsPrincipal ul {
    width: 100%;
    margin: 19.4% auto 0.6%;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 1.28em;
  }
  #ctsPrincipal ul li {
    width: 46.3%;
    margin-bottom: 4.9em;
  }
  #ctsPrincipal ul li img {
    margin-bottom: 1.15em;
  }
  #ctsPrincipal ul li .textBox {
    border-left: #686777 0.4em solid;
    padding-left: 1.5em;
    padding-top: 0.2em;
    min-height: 9.7em;
  }
  #ctsPrincipal ul li .textBox h4 {
    font-size: 1.4em;
    font-weight: 400;
    margin-bottom: 0.34em;
  }
  #ctsPrincipal ul li .textBox h3 {
    font-size: 1.7em;
    font-weight: 400;
  }
  #ctsPrincipal ul li a.more {
    margin-top: 1.5em;
  }
  #ctsPrincipal ul li a.more img {
    width: 51.1%;
    padding: 1.45em 0;
  }
  #ctsPrincipal ul li.lecture3 {
    width: 103%;
    margin-top: 7.3%;
  }
  #ctsPrincipal ul li.lecture3 span.photos {
    margin-bottom: 0.65em;
    flex-flow: row wrap;
    justify-content: space-between;
  }
  #ctsPrincipal ul li.lecture3 span.photos img {
    width: 46.2%;
  }
  #ctsPrincipal ul li.lecture3 span.photos img:last-child {
    margin: 1.35em auto 1.45em;
  }
  #ctsPrincipal ul li.lecture3 .textBox {
    padding-left: 1.9em;
    padding-top: 0.3em;
    min-height: 9em;
  }
  #ctsPrincipal ul li.lecture3 .textBox.col2 img {
    width: 27.74em;
    margin-bottom: 0.35em;
  }
  #ctsPrincipal ul li.lecture3 .textBox.col2 h4 {
    margin-bottom: 1.05em;
  }
  #ctsPrincipal ul li.lecture3 .textBox h3 {
    font-size: 1.66em;
    letter-spacing: 0;
  }
  /*============================
	#ctsAboute
	============================*/
  #ctsAboute {
    padding: 2.6em 1.4em 3.2em 3.5em;
    margin-bottom: 20.4%;
    width: 87%;
    margin-left: 6.4%;
    font-size: 1.63em;
  }
  #ctsAboute .filterin {
    margin-top: -20em;
  }
  #ctsAboute h2 {
    margin: 0 0 0.1em;
    margin-left: -0.38em;
    font-size: 2.85em;
    font-weight: 400;
  }
  #ctsAboute .flex {
    display: block;
  }
  #ctsAboute .flex > div:first-child {
    width: 100%;
  }
  #ctsAboute .flex div h3 {
    font-weight: 400;
    font-size: 1.37em;
    margin-bottom: 0.55em;
    margin-top: 2.7em;
    position: relative;
  }
  #ctsAboute .flex div h3:before {
    width: 0.25em;
    height: 70%;
    margin: 0.25em 0 0 -0.8em;
  }
  #ctsAboute .flex div p + h3 {
    margin-top: 2.55em;
  }
  #ctsAboute .flex div p {
    font-size: 2.05em;
    margin-bottom: 0.45em;
    line-height: 1.4;
  }
  #ctsAboute .flex div p.lead {
    margin-top: 0.95em;
    margin-bottom: 1.2em;
    font-size: 1.85em;
    line-height: 1.48;
    white-space: nowrap;
  }
  #ctsAboute .flex div p.step {
    font-size: 2.1em;
    line-height: 1.66;
    margin-top: -0.1em;
    margin-bottom: 0.85em;
  }
  #ctsAboute .flex div p.step small{
    font-size: 0.66em;
    margin-left: -0.5em;
  }
  #ctsAboute .flex div p.step small.spflow{
     margin-top: -0.4em;
     display: block;
  }
  #ctsAboute .flex div p.info {
    line-height: 1.76;
    margin-top: 0.1em;
    margin-bottom: 0.45em;
  }
  #ctsAboute .flex div small {
    font-size: 0.93em;
    line-height: 1.56;
    margin-bottom: 4.3em;
    letter-spacing: 0.04em;
  }
  #ctsAboute .flex div p small {
    font-size: 0.66em;
    margin-right: 1em;
    margin-bottom: 0;
    line-height: 1.65;
  }
  #ctsAboute .flex div p small.spinline {
    display: inline;
  }
  #ctsAboute .flex div p small a.mailLink {
    margin-left: 0;
    font-size: 1.06em;
  }
  #ctsAboute .flex div a.btnEntry {
    width: 100%;
    font-size: 1.45em;
    letter-spacing: 0;
    padding: 0.7em 0;
    margin-top: 2.4em;
    margin-left: -4.4%;
  }

  /*============================
  #ctsBanner
  ============================*/
  #ctsBanner .banner{
    max-width: 49.029em;
    margin: 2.2em auto 10em auto;
    display: block;
  }
  #ctsBanner .banner img{
    width: 100%;
  }
  #ctsBanner .banner .banner_txt{
    width: 100%;
    padding: 1.3em 0;
    margin-top: 0.3em;
  }
  #ctsBanner .banner .banner_txt p{
    font-size: 1.36em;
    text-align: center;
    font-size: 2.2em;
  }

  /*============================
	#ctsSchedule
	============================*/
  #ctsSchedule {
    padding: 3.4em 3em 2.6em;
    margin-bottom: 41.3%;
    font-size: 1.33em;
    width: 65.2%;
    margin-left: 6.4%;
  }
  #ctsSchedule h2 {
    margin: 0 0 1.2em;
    font-size: 3.45em;
    letter-spacing: 0;
    font-weight: 400;
    line-height: 1.2;
  }
  #ctsSchedule .schedule {
    margin-bottom: 16.2%;
    display: block;
    margin-top: 21%;
  }
  #ctsSchedule .schedule li {
    width: 100%;
    min-height: 21.75em;
    margin-bottom: 14.9%;
  }
  #ctsSchedule .schedule li:after {
    width: 0.45em;
    height: 4em;
    top: auto;
    bottom: 0;
    left: 50%;
    margin: 0 0 -3.7em -0.28em;
  }
  #ctsSchedule .schedule li h3 {
    margin: 0;
    padding: 11.5% 0 4.3%;
  }
  #ctsSchedule .schedule li h3 img {
    height: 3.9em;
  }
  #ctsSchedule .schedule li h4 {
    font-size: 1.8em;
    font-weight: 500;
    padding-bottom: 1.9em;
  }
  #ctsSchedule .schedule li h4:after {
    width: 2.3em;
    height: 0.27em;
    left: 50%;
    top: 0;
    margin: 2.25em 0 0 -1.18em;
  }
  #ctsSchedule .schedule li p {
    font-size: 1.82em;
    line-height: 1.45;
    font-weight: 500;
  }
  #ctsSchedule .schedule li p sup {
    font-size: 0.84em;
    margin: 0-2.4em 0.3em 0.3em;
  }
  #ctsSchedule small.note {
    display: block;
    font-size: 1.16em;
    line-height: 1.6;
    text-indent: -3.2em;
    padding-left: 3.2em;
    margin-bottom: 1.5em;
  }

  /*============================
	#ctsEntry
	============================*/
  #ctsEntry {
    padding: 2.9em 0 4.1em 2.8em;
    margin-bottom: 40.6%;
    width: 70.3%;
    width: 82.7em;
    font-size: 1.33em;
    width: 87%;
    margin-left: 6.4%;
  }
  #ctsEntry h2 {
    margin: 0 0 1.85em;
    font-size: 3.4em;
    font-weight: 400;
  }
  #ctsEntry p.theme {
    line-height: 1.7;
    font-size: 2.5em;
  }
  #ctsEntry ul {
    margin: 4.3em 0 4.7em;
    font-size: 1.6em;
    line-height: 1.7;
    letter-spacing: 0.06em;
  }
  #ctsEntry ul li {
    text-indent: -1.7em;
    padding-left: 1.7em;
    margin-bottom: 1.8em;
  }
  #ctsEntry ul li span {
    margin-right: 0.6em;
  }
  #ctsEntry .qa {
    margin: 6.1em 0 8.5em;
  }
  #ctsEntry .qa h3 {
    font-size: 2em;
    margin-top: 2.8em;
    text-indent: -1.4em;
    padding-left: 1.3em;
  }
  #ctsEntry .qa h3 span {
    margin-right: 0.2em;
    margin-left: 0.2em;
  }
  #ctsEntry .qa p {
    margin-top: 1.6em;
    font-size: 1.67em;
    text-indent: -1.3em;
    padding-left: 1.5em;
    line-height: 1.65;
    margin-left: 0.13em;
  }
  #ctsEntry .qa p span {
    margin-right: 0.3em;
  }
  #ctsEntry h3 {
    font-size: 1.65em;
    margin-bottom: 0.55em;
    margin-top: 2.1em;
    margin-left: 0.7em;
  }
  #ctsEntry h3:before {
    width: 0.25em;
    height: 70%;
    margin: 0.25em 0 0 -0.8em;
  }
  #ctsEntry p {
    font-size: 2.5em;
  }
  #ctsEntry p.date {
    margin-left: 0.5em;
    margin-bottom: 3.25em;
  }
  #ctsEntry ol {
    margin: 0.6em 0 1em 0.8em;
    font-size: 1.61em;
    line-height: 1.7;
    letter-spacing: 0.06em;
  }
  #ctsEntry ol li {
    text-indent: -1.4em;
    padding-left: 1.5em;
  }
  #ctsEntry ol li span {
    margin-right: 0.3em;
  }
  #ctsEntry small {
    font-size: 1.22em;
    margin-left: 2.1em;
    text-indent: -1em;
    display: inline-block;
  }
  #ctsEntry a.btnEntry {
    width: 91%;
    font-size: 1.65em;
    letter-spacing: 0;
    padding: 0.8em 0;
    margin-top: 3.4em;
    margin-left: 0.1%;
  }

  /*============================
	#ctsCurriculum
	============================*/
  #ctsCurriculum {
    padding: 3.4em 3em 3em;
    margin-bottom: 41.3%;
    font-size: 1.33em;
    width: 77.9%;
    margin-left: 6.4%;
  }
  #ctsCurriculum h2 {
    margin: 0 0 1.2em;
    font-size: 3.45em;
    letter-spacing: 0;
    font-weight: 400;
    line-height: 1.2;
  }
  #ctsCurriculum .curriculum {
    margin-bottom: -7.9%;
    display: block;
    margin-top: 0;
    width: 79.6%;
    margin-right: 6%;
  }
  #ctsCurriculum .curriculum li {
    width: 100%;
    min-height: 28.6em;
    margin-bottom: 14.9%;
  }
  #ctsCurriculum .curriculum li:after {
    width: 0.45em;
    height: 4em;
    top: auto;
    bottom: 0;
    left: 50%;
    margin: 0 0 -3.7em -0.28em;
  }
  #ctsCurriculum .curriculum li h3 {
    margin: 0;
    padding: 11.5% 0 2%;
  }
  #ctsCurriculum .curriculum li h3 img {
    height: 4.1em;
  }
  #ctsCurriculum .curriculum li h4 {
    font-size: 2.1em;
    font-weight: 500;
    padding-bottom: 1.8em;
  }
  #ctsCurriculum .curriculum li h4:after {
    width: 1.7em;
    height: 0.17em;
    left: 50%;
    top: 0;
    margin: 2.35em 0 0 -0.835em;
  }
  #ctsCurriculum .curriculum li p {
    font-size: 2.07em;
    line-height: 1.55;
    letter-spacing: 0;
    font-weight: 500;
    line-height: 1.5;
    display: block;
    text-align: center;
  }
  #ctsCurriculum .spflex{
    display:flex;
    align-items: start;
    margin: 4.6em 0 3em;
  }
  #ctsCurriculum .curriculum li p span{
    justify-content: center;
    height: 4.2em;
}
  #ctsCurriculum .curriculum li p small{
    text-align: center;
    width: 100%;
    display: inline-flex;
    justify-content: center;
    line-height: 1.13;
}
  #ctsCurriculum .curriculum li p.l4 {
    font-size: 1.44em;
    line-height: 1.33;
    margin-top: 0.14em;
  }
  #ctsCurriculum .curriculum li p sup {
    font-size: 0.64em;
    margin: 0 -2.4em 0.8em 0.2em;
  }
  #ctsCurriculum small.note {
    display: block;
    font-size: 1.16em;
    line-height: 1.55;
    margin-bottom: 1.5em;
    width: 110%;
    white-space: nowrap;
  }
  #ctsCurriculum small.note span {
    display: block;
    margin-bottom: 0em;
  }
  #ctsCurriculum .term{
    display:block;
    width: 3.9em;
    overflow: hidden;
  }
  #ctsCurriculum .term p{
  writing-mode: vertical-rl;
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  padding-right: 0.1em;
  height: 57.46em;
  font-size: 1.9em;
  letter-spacing: 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  }
  #ctsCurriculum .term p + p{
  margin-top: 0.7em;
  }
  /*============================
	#ctsNotes
	============================*/
  #ctsNotes {
    padding: 2.8em 1.7em 1.64em 2.9em;
    margin-bottom: 4.8%;
    width: 70.3%;
    width: 82.7em;
    font-size: 1.35em;
    width: 87%;
    margin-left: 6.4%;
  }
  #ctsNotes h2 {
    margin: 0 0 1.2em;
    font-size: 3.4em;
  }
  #ctsNotes p {
    font-size: 1.15em;
    line-height: 2.1;
    margin-bottom: 2em;
    text-indent: -1em;
    padding-left: 1em;
  }

  /*============================
    #ctsFooter
    ============================*/
  #ctsFooter {
    font-size: 0.93em;
  }
  #ctsFooter a.btnEntry {
    width: 86.2%;
    font-size: 2.45em;
    padding: 0.9em 0;
    margin: 8.35em 0 17.8em;
  }
  #ctsFooter h2 {
    margin-bottom: 6.2%;
  }
  #ctsFooter h2 img {
    width: 8.8em;
    padding: 0.3em 0.8em;
    font-size: 0.95em;
  }
  #ctsFooter .share a {
    border-radius: 50%;
    margin: 0 6.7%;
    background: #fff;
  }
  #ctsFooter .banner {
    width: 52.5em;
    display: block;
    margin: 24.3% auto 1.4%;
  }
  #ctsFooter .share a img {
    width: 12.35em;
    transition: 0.24s;
  }
  #ctsFooter p.copyright {
    width: 24.2em;
    margin: 17.9% 0 2.4%;
  }
  #ctsFooter .banner{
    width: 85.8%;
    margin: 14.8em auto 0em auto;
  }
  #ctsFooter .banner img{
    width: 100%;
  }
  #ctsFooter .banner .banner_txt{
    width: 100%;
    margin-top: 0.5em;
    padding: 1.4em 0;
  }
  #ctsFooter .banner .banner_txt p{
    font-size: 2.5em;
    font-weight: 500;
    letter-spacing: 0;
  }
  /*============================
  #modal
  ============================*/
  #modal .scroll {
    padding: 9em 0;
  }
  #modal .cts {
    width: 85.334%;
    max-width: 100%;
  }
  #modal .cts:before {
    width: 0.46em;
  }
  #modal .cts .close {
    width: 5.3em;
    margin: 0;
  }
  #modal .prof li .course {
    padding: 6.55em 0 0em 4.45em;
    margin-bottom: -9.9em;
  }
  #modal .prof li .information {
    padding: 7.55em 0 5.4em 4.6em;
  }
  #modal .profile {
    margin: 7.1em 0 4.7em;
    display: block;
  }
  #modal .profile.nolead {
    margin: 0em 0 8.2em;
  }

  #modal .profile .photo {
    width: 15.2em;
    float: left;
    margin-right: 3.1em;
  }
  #modal .profile .textArea {
    margin-left: 0;
    width: 100%;
  }
  #modal .profile .textArea h4 {
    font-size: 1.6em;
    margin-bottom: 0.6em;
    line-height: 1.1;
  }
  #modal .profile .textArea h3 {
    font-size: 3.05em;
    line-height: 1.3;
  }
  #modal .profile .textArea h5 {
    font-size: 1.55em;
  }
  #modal .profile .textArea p.tl {
    font-size: 1.47em;
    margin: 1.7em 0 2.4em;
    line-height: 1.96;
    min-height: 3.9em;
  }
  #modal .profile .textArea p {
    font-size: 1.5em;
    line-height: 2.03;
    margin-bottom: 1em;
    letter-spacing: 0.02em;
  }
  #modal .profile .textArea .points {
    font-size: 1.2em;
    line-height: 2.03;
    letter-spacing: 0.02em;
    margin: 1.5em 0 2.1em;
  }
  #modal .profile .textArea .points li {
    text-indent: -1em;
    padding-left: 0.8em;
  }
  #modal .profile .textArea .points li.indent1 {
    text-indent: -4.3em;
    padding-left: 4.1em;
  }
  #modal .profile .textArea .points li.indent2 {
    text-indent: -8.3em;
    padding-left: 8.1em;
  }
  #modal .profile .textArea .works {
    flex-wrap: wrap;
    width: 90%;
  }
  #modal .profile .textArea .works li {
    margin-right: 1.5em;
    margin-bottom: 1.1em;
  }
  #modal .profile .textArea .works li img {
    height: 12.229em;
    width: auto;
  }
  #modal .prof li .message {
    font-size: 1.48em;
    line-height: 2.03;
    margin-bottom: 1em;
    letter-spacing: 0.02em;
  }
  #modal .prof li .message p {
    margin-bottom: 2.1em;
    letter-spacing: 0.01em;
  }
  #modal .prof li h2 {
    margin: 0 0 1.1em;
    line-height: 0.98;
  }
  #modal .prof li h2 img {
    height: 1.49em;
  }
  #modal.sel4 .prof li h2 img {
    height: 1.38em;
    margin: .1em 0;
  }
  #modal .prof li h2 small {
    font-weight: 400;
    font-size: 0.65em;
  }
  #modal .prof li p.lead {
    font-size: 1.45em;
    line-height: 2.1;
    margin-bottom: 3.9em;
  }
  #modal .prof li p.lead .sp_margin {
    margin: 2em 0 2.2em;
    display: block;
  }
  #modal .prof li p.lead .indent {
    text-indent: -1em;
    padding-left: 0.8em;
    display: inline-block;
  }
  #modal .deputy {
    padding: 13em 0 19.1em 4.6em;
    margin-top: 0.8em;
    display: block;
  }
  #modal .deputy > li {
    width: 100%;
    margin-bottom: 11em;
    font-size: 1.06em;
    display: block;
    clear: both;
  }
  #modal .deputy > li:nth-of-type(n + 3){
    margin-bottom: 11em;
  }
  #modal .deputy > li:last-of-type{
    margin-bottom: 11.7em;
  }
  #modal .deputy > li + li {
    padding-top: 13.7em;
  }
  #modal .deputy li img {
    width: 11.5em;
    float: left;
    margin-right: 2.1em;
  }

  #modal .deputy li .textArea h4 {
    font-size: 1.38em;
    margin-bottom: 0.25em;
  }
  #modal .deputy li .textArea h3 {
    font-size: 2.8em;
  }
  #modal .deputy li .textArea h5 {
    font-size: 1.4em;
    letter-spacing: 0.01em;
    margin-bottom: 0.5em;
  }
  #modal .deputy li .textArea p.tl {
    font-size: 1.35em;
    margin-bottom: 1.5em;
  }
  #modal .deputy li p {
    font-size: 1.37em;
    line-height: 2.05;
    letter-spacing: 0;
    clear: both;
  }
  #modal .deputy li .points {
    font-size: 1.11em;
    font-weight: 400;
    line-height: 2.03;
    letter-spacing: 0;
    margin: 1.4em 0 1.7em;
  }
  #modal .deputy li .works {
    height: 11.4285em;
  }
}