@charset "utf-8";

/*------------------------------------------------------------------------------
  reset
------------------------------------------------------------------------------*/

body {
  font-size: 14px;
  position: relative;
  -webkit-appearance: none;
  -webkit-text-size-adjust: 100%;
}

#wrapper,
.outer-block {
  min-width: 320px;
}

.inner-block {
  padding: 0 10px;
  width: auto;
}

main .inner-block {
  padding: 30px 10px;
}

main .outer-block:last-child .inner-block {
  padding-bottom: 60px;
}

input[type="submit"] {
  -webkit-text-size-adjust: 100%;
}

input,
select,
textarea {
  font-size: 16px !important;
}

.pc {
  display: none !important;
}

.pc-only {
  display: none !important;
}

.pc-ib {
  display: none !important;
}

.sp {
  display: block !important;
}

.sp-ib {
  display: inline-block !important;
}


/*------------------------------------------------------------------------------
  common-parts
------------------------------------------------------------------------------*/

/* title
----------------------------------------*/

.c-ttl01 .en img {
  height: 70px;
}

.c-ttl01 .ja {
  font-size: 15px;
  bottom: 12px;
}

.c-ttl02 {
  font-size: 22px;
  margin-bottom: 15px;
}

/* btn
----------------------------------------*/
.btn01,
.btn01.disabled {
  background-size: 100% 40px;
  width: 100%;
}

.btn01 {
  font-size: 14px;
  height: 40px;
  line-height: 40px;
}
.btn01 p {
  padding-left: 15px;
}
.btn01 p::before {
  border-width: 7px 0 7px 8px;
}

/*------------------------------------------------------------------------------
  header
------------------------------------------------------------------------------*/

#header .inner-block {
  display: block;
  padding: 10px;
  height: auto;
}

#header .logo {
}

#header .logo img {
  width: 128px;
  /* width: 24vw; */
}

#header .txt {
  background-size: 35px 35px;
  margin: 12px 0 0;
  /* padding-left: 43px; */
  padding-left: 0;
  vertical-align: top;
}

#header .txt img {
  width: 65vw;
}

#header .txt .date {
  font-size: 10px;
  line-height: 16px;
}

#header .txt .ttl {
  font-size: 13px;
  margin-top: 7px;
}

/* btn menu
----------------------------------------*/

.btn-menu {
  width: 45px;
  height: 45px;
}

.btn-menu .inn {
  width: 23px;
  height: 18px;
}

.btn-menu .line:nth-of-type(3) {
  top: 16px;
}

.btn-menu .line:nth-of-type(2) {
  top: 8px;
}

/*------------------------------------------------------------------------------
  nav
------------------------------------------------------------------------------*/

#nav {
  width: 260px;
}

.nav-list {
  padding: 40px 0;
}

.nav-list li + li {
  margin-top: 40px;
}

.nav-list li .en img {
  height: 45px;
}

.nav-list .ja {
  font-size: 12px;
  bottom: 10px;
}

/*------------------------------------------------------------------------------
  footer
------------------------------------------------------------------------------*/

#footer .foot-nav-box {
  padding: 30px 0 20px;
}

#footer .foot-nav-box ul {
  margin: auto;
  max-width: 300px;
}

#footer .foot-nav-box li {
  margin-bottom: 10px;
}

#footer .foot-nav-box li + li {
  border-left: 1px solid #fff;
  margin-left: 10px;
  padding-left: 10px;
}

#footer .foot-nav-box li a {
  font-size: 12px;
}

#footer .copyright-box {
  padding: 30px 10px 25px;
}

/* pagetop
----------------------------------------*/

#pagetop {
  top: -45px;
}

#pagetop a {
  width: 45px;
  height: 45px;
}

#pagetop a::before {
  width: 12px;
  height: 12px;
}

/*------------------------------------------------------------------------------
  breadcrumb
------------------------------------------------------------------------------*/

.breadcrumb-area {
  padding: 5px 0 10px;
}

.breadcrumb-area * {
  font-size: 11px;
}

/*------------------------------------------------------------------------------
  top
------------------------------------------------------------------------------*/

/* top-mv-block
----------------------------------------*/

.top-mv-block {
  background-size: 100% 170px;
  margin-top: -110px;
  padding: 110px 0 0;
}

.top-mv-block .ttl {
  top: 146px;
  left: 10px;
  width: auto;
}

.top-mv-block .ttl img {
  width: 89vw;
}

/* phase2 */
.top-mv-block.phase2 {
  padding: 110px 0 0;
}
.top-mv-block.phase2 .ttl {
  top: 40%;
  /* margin-top: 80px; */
  height: 155px;
}
.top-mv-block.phase2 .ttl img {
  width: 90%;
}

.top-mv-block .img img {
  width: 100%;
}

/* top-about-block
----------------------------------------*/

.top-about-block .txt {
  line-height: 1.57;
  margin: 0 0 30px;
}

.top-about-block .txt:first-letter {
  font-size: 31px;
}

.top-about-block .aco-body .inner-block {
  padding: 30px 10px;
}

/* top-news-block
----------------------------------------*/

.top-news-block .inner-block {
  padding: 45px 10px;
}

.top-news-block .block-ttl {
  margin-bottom: -20px;
}

.top-news-block .block-ttl img {
  height: 70px;
  width: auto !important;
}

.news-list {
  border-width: 2px 0;
  padding: 30px 0;
}

.news-list li {
  display: block;
}

.news-list li + li {
  margin-top: 28px;
}

.news-list li .date {
  display: block;
  font-size: 14px;
  line-height: 1;
  padding-top: 0;
  width: auto;
}

.news-list li .ttl {
  font-size: 16px;
  margin-top: 10px;
  width: auto;
}

/* top-menu-block
----------------------------------------*/

.top-menu-block .box {
  text-align: center;
}

.top-menu-block .box .ttl {
  min-height: 110px;
}

.top-menu-block .box + .box {
  margin-top: 20px;
}

.top-menu-block .link-wrap + .link-wrap {
  margin-top: 20px;
}

.top-menu-block .ttl .en img {
  height: 50px;
}

.top-menu-block .ttl .ja {
  font-size: 15px;
  letter-spacing: 0.04em;
  margin-top: 15px;
}

.top-menu-block .skew,
.top-menu-block .skew .inner {
  height: 50vw;
}

.top-menu-block .skew {
  display: block;
  margin-top: -90px;
}

.top-menu-block .box .skew .inner {
  background: no-repeat center center / cover;
}

.top-menu-block .box.outline .skew .inner {
  background-image: url(../img/top/sp/outline_img.jpg);
}

.top-menu-block .box.syllabus .skew .inner {
  background-image: url(../img/top/sp/syllabus_img.jpg);
}

.top-menu-block .box.dialogue .skew .inner {
  background-image: url(../img/top/sp/dialogue_img.jpg);
}

.top-menu-block .box.message .skew .inner {
  background-image: url(../img/top/sp/message_img.jpg);
}

/* top-partner-block
----------------------------------------*/

.top-partner-block .c-ttl01 .en img {
  height: 108px;
}

.top-partner-block .c-ttl01 .ja {
  bottom: 12px;
}

.top-partner-block .txt,
.top-partner-block .partner {
  line-height: 1.57;
  text-align: left;
}

.top-partner-block h3.partner {
  margin-top: 35px;
  margin-bottom: 20px;
  font-weight: bold;
  text-align: center;
}

.top-partner-block .partner {
  margin-top: 20px;
}

.top-partner-block .partner-list {
  width: 100%;
  padding: 2vw;
}

.top-partner-block .partner-list span {
  padding: 2vw;
}

.top-partner-block .partner-list span img {
  height: 7.5vw;
}

.top-partner-block .partner .bold {
  display: inline-block;
  margin-bottom: 3px;
  text-align: center;
  width: 100%;
}

/*------------------------------------------------------------------------------
  syllabus
------------------------------------------------------------------------------*/

/* ttl-block
----------------------------------------*/

.ttl-block .logo {
  margin-bottom: 20px;
}

.ttl-block .logo img {
  height: 48px;
}

.ttl-area {
  margin-bottom: 20px;
}

.ttl-area .ttl {
  background-size: 35px 35px;
  font-size: 23px;
}

.ttl-area .ttl small {
  font-size: 3.5vw;
}

.ttl-area .desc {
  line-height: 1.6;
  margin-top: 20px;
  text-align: left;
}

/* syllabus-menu-block
----------------------------------------*/

.syllabus-menu-block .list li {
  height: 50px;
  width: 100%;
}

.syllabus-menu-block .list li .ttl,
.syllabus-large-btn .ttl {
  font-size: 14px;
}

.syllabus-menu-block .list.large li {
  height: 50px;
  width: 100%;
}

.syllabus-large-btn {
  margin: 30px auto 40px;
}

.syllabus-large-btn a {
  width: 300px;
  height: 50px;
  line-height: 50px;
}

/* syllabus-list
----------------------------------------*/

.syllabus-list {
  display: block;
  margin: 0;
}

.syllabus-list li {
  margin: 0;
  width: 100%;
}

.syllabus-list li + li {
  margin-top: 36px;
}

.syllabus-list .img {
  padding-right: 100px;
  width: 100%;
}

.syllabus-list .en-name {
  font-size: 52px;
  top: 15px;
  right: 15px;
}

/* specialist-block
----------------------------------------*/

.specialist-list {
  display: block;
}

.specialist-list li {
  padding-top: 45px;
  margin: 0 auto 30px;
  width: 300px;
}

.specialist-list .txt-wrap {
  padding-top: 150px;
  width: 146px;
  top: 20px;
}

.specialist-list .en-name {
  font-size: 40px;
  left: 15px;
}

.specialist-list .txt-wrap .ttl {
  font-size: 18px;
}

.specialist-list .img-wrap {
  width: 212px;
  height: 212px;
}

.specialist-list .img {
  margin: 4% 0 0 -2%;
  width: 90%;
}

.specialist-list .btn,
.specialist-list .btn-close {
  font-size: 15px;
}

.specialist-list .detail-body {
  top: calc(100% - 30px);
}

/* talk-block
----------------------------------------*/

.talk-block .sub-ttl {
  font-size: 14px;
  margin-bottom: 10px;
}

.talk-block .wrap {
  display: block;
}

.talk-block .box + .box {
  margin-top: 20px;
}

.talk-block .box .img {
  margin-bottom: 10px;
}

.talk-block .box .name {
  font-size: 12px;
}

.talk-block .box .talk-ttl {
  font-size: 14px;
  margin-top: 3px;
}

/* img-bg-block
----------------------------------------*/
.img-bg-block {
  margin: 15px auto;
}

.img-bg-block .box + .box {
  margin-top: 30px;
}

.img-bg-block .box .name {
  font-size: 12px;
  margin-top: 10px;
}
.img-bg-block .box .talk-ttl {
  font-size: 14px;
  margin-top: 3px;
}

.img-bg-block.talk {
  margin-bottom: 60px;
}

.img-bg-block.specialist {
  margin-bottom: 40px;
}

.img-bg-block.specialist .img.bg {
  background-position: top right;
  height: 150px;
}

/*------------------------------------------------------------------------------
  message
------------------------------------------------------------------------------*/

.president-message-block .inner-block {
  padding: 0 10px;
  width: auto;
}

.message .ttl-area .ttl.en {
  font-size: 50px;
  letter-spacing: 0.01em;
  line-height: 1.3;
}
.message .ttl-area.adviser .ttl.en {
  font-size: 46px;
}

.mobile .message .ttl-area .sub-ttl {
  font-size: 15px;
  display: inline-block;
  vertical-align: middle;
  top: calc(50% - 1.4em);
}

/* president-message-block
------------------------------*/
.president-message-block .img-area {
  float: none;
  margin: 0 0 15px;
  text-align: center;
}

.president-message-block .txt-area {
  float: none;
  padding-left: 0;
  width: 100%;
  margin-bottom: 20px;
}

.president-message-block .txt-area .name>div {
  font-size: 15px;
  float: none;
  line-height: 50px;
  height: 50px;
  margin: 20px auto 0;
  width: 200px;
}
.president-message-block .txt-area .name .small-txt {
  font-size: 12px;
}

.president-message-block .inner-block,
.adviser-message-block .inner-block {
  padding: 20px 10px 0;
}

/* adviser-message-block
------------------------------*/
.adviser-message-block .message-li li {
  padding: 25px 0;
}

.adviser-message-block .message-li li:nth-child(even) {
  margin: 0 -10px;
  padding: 25px 10px;
}

.adviser-message-block .person-area {
  margin-bottom: 20px;
}

.adviser-message-block .person-area .img-box img{
  width: 100px;
  height: auto;
}

.adviser-message-block .person-area .img-box .name {
  font-size: 14px;
  height: 100px;
  padding: 40px 25px;
  width: calc(100% - 100px);
}

.adviser-message-block .person-area .txt-box {
  padding: 15px;
}

.adviser-message-block .message-area .txt {
  margin-bottom: 10px;
}

/* syllabus 詳細ページ
----------------------------------------*/
.syllabus .btn-box {
  margin: 30px auto 60px;
}

.category .ttl-area .ttl {
  font-size: 35px;
}
.category .ttl-area .ttl.middle {
  font-size: 32px;
}

/* cat01 */
.category01 .category-menu-block .list {
  background: url(../img/syllabus/01/sp_cate-menu-bg01.jpg) no-repeat top left / 375px auto #e51068;
}

/* cat02 */
.category02 .category-menu-block .list {
  background: url(../img/syllabus/02/sp_cate-menu-bg02.jpg) no-repeat top left / 375px auto #854798;
}

/* cat03 */
.category03 .category-menu-block .list {
  background: url(../img/syllabus/03/sp_cate-menu-bg03.jpg) no-repeat top left / 375px auto #b8934a;
}

/* cat04 */
.category04 .category-menu-block .list {
  background: url(../img/syllabus/04/sp_cate-menu-bg04.jpg) no-repeat top left / 375px auto #009f6a;
}

/* cat05 */
.category05 .category-menu-block .list {
  background: url(../img/syllabus/05/sp_cate-menu-bg05.jpg) no-repeat top left / 375px auto #0065b2;
}

/* cat06 */
.category06 .category-menu-block .list {
  background: url(../img/syllabus/06/sp_cate-menu-bg06.jpg) no-repeat top left / 375px auto #ed7100;
}

/* menu */
.category-menu-block .list li + li::before {
  background: #fff;
  background-size: 100% 1px;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  width: calc(100% - 20px);
  top: 0;
  right: 0;
  left: 0;
  margin: auto;
}

.category-menu-block .list li a {
  padding: 10px 15px 36px 16vw;
  text-align: left;
}

.category-menu-block .list li a::after {
  bottom: 11px;
}

.category-menu-block .list li.even-li {
  display: none;
}

.category-menu-block .list li a .ttl {
  font-size: 17px;
}
.category-menu-block .list li a .sub-ttl {
  font-size: 11px;
  margin-top: 3px;
}
.category-menu-block .list li a .num {
  color: #fff;
  width: 11vw;
  font-size: 3.5vw;
  line-height: 23px;
  padding: 0 0;
  position: absolute;
  text-align: center;
  top: 12px;
  margin: auto;
  left: 15px;
}
.category-menu-block .list li a::after {
  height: 20px;
  width: 30px;
}
.category-menu-block .list li a::before {
  border-width: 7px 5px 0 5px;
  bottom: 18px;
}

/* content */
.course-list > li {
  padding: 22px;
}

.course-list .ttl-main {
  font-size: 20px;
  padding-left: 14vw;
}
.course-list .ttl-main .middle,
.course-list .ttl-main .small {
  font-size: 20px;
}
.course-list .ttl-main .num {
  font-size: 14px;
  line-height: 22px;
  height: 22px;
  width: 11vw;
  font-size: 3.5vw;
}
.course-list .ttl-sub {
  font-size: 14px;
}
.course-list .coordinator {
  width: calc(100% - 155px);
}
.course-list .coordinator .course-list-head {
  font-size: 12px;
  line-height: 1.4;
}
.course-list .coordinator .name {
  font-size: 14px;
}
.course-list .coordinator .name .small {
  font-size: 10px;
}

.course-list .coordinator-img .en-name {
  font-size: 31px;
  right: -18px;
}
.course-list .coordinator-img img {
  width: 130px;
  height: auto;
}

.course-list .box-wrap .box + .box {
  margin-top: 40px;
  position: relative;
}
.course-list .box-wrap .box + .box::before {
  background-size: 100% 1px;
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  top: -20px;
  right: 0;
  left: 0;
  margin: auto;
}

.course-list .desc-box,
.course-list .schedule-list,
.course-list .teacher-list {
  font-size: 12px;
}

.course-list .schedule-list .num::before {
  font-size: 12px;
  width: 4em;
}

.course-list .share-area p {
  display: inline-block;
  margin: 0 5px 0 0;
}

.course-list .teacher-list li.teacher-img {
  width: 80px;
}
.course-list .teacher-list .teacher-img + li {
  width: calc(100% - 90px);
}

/*------------------------------------------------------------------------------
  news
------------------------------------------------------------------------------*/
main .news .ttl-block .inner-block {
  padding: 20px 10px;
}

.news .ttl-area .ttl.en {
  font-size: 60px;
}

.news-block .ttl {
  font-size: 16px;
  margin-bottom: 20px;
}

.news-block .img-area {
  margin-bottom: 20px;
  text-align: center;
}

.news-block .news-box + .news-box {
  margin-top: 20px;
}

.news-block .link {
  font-size: 15px;
}

.news-block .link a {
  padding-left: 18px;
  padding-right: 23px;
}

.news-block .txt-area.left {
  padding-right: 0;
}
.news-block .txt-area.right {
  padding-left: 0;
}

/* interview
------------------------------*/
.ttl-type02 .ttl-area {
  margin: 0 auto 15px;
}
.ttl-type02 .ttl-area .ttl img {
  height: 35px;
}
.ttl-type02 .ttl-area .sub-ttl {
  top: calc(50% + 40px);
}
.ttl-type02 .ttl-area .sub-ttl img {
  height: 20px;
}

.min #wrapper,
.min .outer-block {
  min-width: 320px;
}
.min .inner-block,
.min .wide .inner-block {
  width: auto;
}

.ttl-type02 .ttl-area + .summary {
  padding-top: 50px;
}

.kv-block .ttl {
  top: 10px;
}
.kv-block .ttl img {
  /* height: 50px; */
  height: 13vw;
}
.kv-block .kv-img {
  /* height: 280px; */
  width: 100%;
  height: 50vw;
  background-size: contain;
}

.profile-area {
  margin-top: 30px;
}
.profile-area.center {
  display: block;
}
.profile-area .img {
  text-align: center;
}
.profile-area .txt {
  margin-top: 20px;
}
.ttl-area.img .ttl {
  background-size: 20px 20px;
  margin: 40px auto 25px;
  padding-bottom: 45px;
  width: auto;
}

.ttl-area.img .ttl img {
  height: 24px;
}
.ttl-area.img.two-line .ttl img {
  height: 66px;
}

/*------------------------------------------------------------------------------
  dialogue
------------------------------------------------------------------------------*/

.dialogue .kv-block {
  margin-top: 20px;
}

.dialogue-link-list {
  flex-wrap: wrap;
  max-width: 420px;
  margin: 0 auto 15vw;
}

.dialogue-link-list li {
  margin: 5px;
  width: calc(50% - 10px);
}

.dialogue-link-list .img {
  width: 100%;
}

.dialogue-link-list li>ins {
  font-size: 3.5vw;
  bottom: 3%;
}

.dialogue-link-list li .number-ttl {
  padding-top: 3vw;
}
.dialogue-link-list li .number-ttl img {
  height: 6vw;
}

/*------------------------------------------------------------------------------
  outline
------------------------------------------------------------------------------*/
.outline .ttl-area .ttl {
  font-size: 23px;
  background-size: 35px 35px;
}
.outline .ttl-area .ttl.small {
  font-size: 21px;
}

.course-info-list {
  text-align: left;
}

.outline-block + .outline-block::before {
  width: calc(100% - 20px);
}

main .outline-block .inner-block + .inner-block {
  padding: 20px 0 60px;
}
main .outline-block .inner-block + .inner-block:last-child {
  padding-bottom: 30px;
}

.outline-block .ttl + .course-info-list {
  margin-top: 30px;
}

.outline-block .text + .c-ttl02 {
  margin-top: 30px;
}

.outline-block .btn-box {
  margin-top: 40px;
}

.outline-block .content-box .detail-text.nowrap {
  white-space : normal;
}

.course-link-list a {
  display: block;
}
.course-link-list a + a {
  margin-left: 0;
  margin-top: 10px;
}
.course-link-list p + p {
  margin-top: 10px;
}

.course-link-list.red-list p + p {
  margin-top: 20px;
  position: relative;
}

.course-link-list span {
  line-height: 1.5;
}

/*------------------------------------------------------------------------------
  contact
------------------------------------------------------------------------------*/
.ttl-type01 .ttl-area .ttl.en {
  font-size: 80px;
}
.mobile .ttl-type01 .ttl-area .sub-ttl {
  font-size: 15px;
  display: inline-block;
  vertical-align: middle;
  top: calc(52% - 1em);
}

.btm-block > .inner-block {
  padding: 0 10px;
}

.btm-block > .inner-block .txt-area {
  display: inherit;
  margin-bottom: 0;
}

.btm-block > .inner-block .txt-area .txt-large {
  font-size: 14px;
  margin-bottom: 0;
  display: block;
  height: auto;
  padding: 20px 0;
  width: 100%;
}

.btm-block > .inner-block .txt-area .txt-cont {
  -webkit-box-align: inherit;
  -ms-flex-align: inherit;
  align-items: inherit;
  display: block;
  height: auto;
  padding: 20px;
  width: 100%;
}

/*------------------------------------------------------------------------------
  ARCHIVES 受講者の声
------------------------------------------------------------------------------*/

.archives-block .inner-block ul li {
  padding: 5vw 7vw;
  margin-bottom: 5vw;
}

.archives-block .inner-block ul li:after {
  width: 12vw;
  height: 12vw;
  left: -6vw;
  top: -6vw;
}

.archives-block .inner-block ul li .archives-wrapper {
  display: block;
}

.archives-block .inner-block ul li .archives-wrapper {
  font-size: 4vw;
}

.archives-block .inner-block ul li .archives-wrapper article {
  border-right: 0;
  margin-bottom: 1.5em;
  padding: 0;
  width: 95%;
  border-bottom:0;
}

.archives-block .inner-block ul li .archives-wrapper article:after {
  display: none;
}

.archives-block .inner-block ul li .archives-wrapper article:last-child {
  margin-bottom: 0;
}

/*------------------------------------------------------------------------------
  privacypolicy
------------------------------------------------------------------------------*/
.policy .ttl-area .ttl.en {
  font-size: 50px;
  line-height: 1.3;
}

.policy .ttl-area .sub-ttl {
  font-size: 15px;
  display: inline-block;
  vertical-align: middle;
  top: calc(50% - 1em);
}

.mobile .policy .ttl-area .sub-ttl {
  top: calc(50% - 1.4em);
}

/*------------------------------------------------------------------------------
  sitepolicy
------------------------------------------------------------------------------*/
.sitepolicy .ttl-area .ttl.en {
  font-size: 50px;
  line-height: 1.3;
}
.sitepolicy .ttl-area .sub-ttl {
  font-size: 15px;
  display: inline-block;
  vertical-align: middle;
  top: calc(50% - 1em);
}

.mobile .sitepolicy .ttl-area .sub-ttl {
  top: calc(50% - 1.4em);
}

.btm-block > .inner-block .txt-area .txt-cont .inner-ttl:after {
  width: 85vw;
}

/* share-area
------------------------------*/
.share-area p {
  display: block;
  margin: 0 0 10px;
}

/*------------------------------------------------------------------------------
  clearfix
------------------------------------------------------------------------------*/

/*
:after {
clear: both;
content: "";
display: block;
height: 0;
font-size: 0;
visibility: hidden;
}*/


.banner-sfdp {
  padding-top: 5vw;
  width: 90%;
}

.banner-sfdp h3 {
  font-size: 3.5vw;
}
