@charset "UTF-8";
/* CSS Faculty Common */
.group{margin-bottom: 80px;}
.facTit{font-weight: bold; font-size: 25px; line-height: 1.5; padding-bottom: 5px; margin-bottom: 20px; text-align: center;}
.facDesc{text-align: center;}

#ot .facTit{color: #cfa67f; border-bottom: 1px solid #cfa67f;}
#pt .facTit{color: #77a9cf; border-bottom: 1px solid #77a9cf;}
#kango .facTit{color: #ca96a1; border-bottom: 1px solid #ca96a1;}

@media only screen and (max-width: 767px) {
  .facTit{font-size: 20px;}
  .facDesc{text-align: left;}
}


@media only screen and (min-width: 768px) {
    .fBnr{display: flex; justify-content: center; margin-left: -15px; margin-right: -15px;}
    .fBnr a{margin: 0 15px;}
    .fBnr a:hover{opacity: .8;}    
}

@media only screen and (max-width: 767px) {
    .fBnr{max-width: 490px; margin: 0 auto 50px;}
    .fBnr a{display: block;}
    .fBnr a:not(:last-of-type){margin-bottom: 20px;}
}

.facBtn{font-size: 20px; line-height: 1.4; color: #fff; font-weight: bold; padding: 10px 0; text-align: center; max-width: 500px; margin: 0 auto; display: flex; justify-content: center; align-items: center; height: 60px; position: relative;}
.facBtn:before{content: ''; width: 26px; height: 27px; background: url("../img/common/ic_pdf.png") no-repeat top left/100% 100%; margin-right: 15px; display: inline-block;}
.facBtn:after{content: ''; position: absolute; top: 50%; right: 4%; border: solid #fff; border-width: 0 1px 1px 0; display: inline-block; padding: 4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin-top: -4px;} 

#ot .facBtn{background: #cfa67f;}
#ot .facBtn:hover{background: #d08e50;}
#pt .facBtn{background: #77a9cf;}
#pt .facBtn:hover{background: #4292ce;}
#kango .facBtn{background: #ca96a1;}
#kango .facBtn:hover{background: #ca7b8c;}

@media only screen and (max-width: 767px) {
  .facBtn{font-size: 16px; padding-right: 5%;}
  .facBtn:before{margin-right: 5px;}
}

/* Intro */
.introTit{text-align: center;}
.introTit span{font-size: 20px; line-height: 1.8; font-weight: bold; box-shadow: inset 0 -.5em 0 0 #fffcc8;}
.introTit2{color: #fff; text-align: center; font-size: 18px; padding-bottom: 1px; margin-bottom: 10px;}
.intro .facDesc{padding: 25px 0 50px;}

.introSquare li,
.introCircle li{margin: 0 0 3px 1em; text-indent: -1em;}
.introSquare li:before{content: '■';}
.introCircle li:before{content: '○';}

#ot .introSquare li:before{color: #cfa67f;}
#ot .introTit2{background: #cfa67f;}
#pt .introSquare li:before{color: #77a9cf;}
#pt .introTit2{background: #77a9cf;}
#kango .introSquare li:before{color: #ca96a1;}
#kango .introTit2{background: #ca96a1;}

@media only screen and (min-width: 1024px) {
  .introBox{display: flex; flex-wrap: wrap; justify-content: space-between;}
  .introItem{width: 47.5%;}
  .introItem.isFull{width: 100%;}
  
  #kango .introItem3{margin-top: 30px;}
  #kango .introItem3 ul{width: 50%;}
}

@media only screen and (max-width: 1023px) {
  .introItem:not(:last-of-type){margin-bottom: 20px;}
}

@media only screen and (max-width: 767px) {  
  .introTit{text-align: left;}
  .introItem ul{width: 100%;}
}

/* Point */
.pointTit{display: flex; align-items: center; position: relative; min-height: 36px; padding-left: 50px; margin-bottom: 10px;}
.pointTit span{font-size: 20px; font-weight: bold; line-height: 1.4; box-shadow: inset 0 -.5em 0 0 #fffcc8; display: inline;}
.pointTit:before{content: ''; width: 36px; height: 36px; position: absolute; top: 50%; left: 0; margin-top: -18px;}
.pointImg{margin-bottom: 10px;}
.pointImg .capBig{text-align: right; padding-top: 8px;}
.pointBtn{display: block; padding: 10px 0 6px; line-height: 1.5; text-align: center; color: #fff; position: relative; margin-top: 8px;}
.pointBtn:after{content: ''; border: solid white; border-width: 0 1px 1px 0; display: inline-block; padding: 3px; position: absolute; top: 50%; right: 10px; margin-top: -3px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}

#ot .pointTit{height: 55px;}
#ot .pointTit:before{background: url("../img/faculty/ot/point.png") no-repeat top left/100% 100%;}
#ot .pointBtn{background: #cfa67f;}
#ot .pointBtn:hover{background: #d08e50;}

#pt .pointTit:before{background: url("../img/faculty/pt/point.png") no-repeat top left/100% 100%;}
#pt .pointBtn{background: #77a9cf;}
#pt .pointBtn:hover{background: #4292ce;}

#kango .pointTit{height: 55px;}
#kango .pointTit:before{background: url("../img/faculty/kango/point.png") no-repeat top left/100% 100%;}
#kango .pointBtn{background: #ca96a1;}
#kango .pointBtn:hover{background: #ca7b8c;}

@media only screen and (min-width: 768px) {
  .pointBox{display: flex; justify-content: space-between;}
  .pointItem{width: 31.7%;}
}

@media only screen and (max-width: 767px) {
  .pointTit{height: auto !important;}
  .pointBox{max-width: 480px; margin: 0 auto;}
  .pointItem:not(:last-of-type){margin-bottom: 30px;}
  .pointImg img{width: 100%;}
}

/* Support */
.supportBox{display: flex; flex-wrap: wrap; justify-content: space-between;}
.supportBox:not(:last-of-type){margin-bottom: 70px;}

.supportInner{width: 100%;}
.supportInfo{width: 100%; max-width: 340px; display: flex; justify-content: space-between; align-content: flex-end; align-items: flex-end;}
.supportInfo *{line-height: 1.3;}
.supportName{margin: 5px 0 10px;}
.supportName span{font-size: 25px; line-height: 1.2;}

.supportImg2{width: 47.1%;}
.supportInner2{width: 47.5%;}

@media only screen and (min-width: 1024px) {
  .supportImg{width: 63.4%;}
  .supportCont{width: 33.6%; display: flex; align-content: space-between; flex-wrap: wrap;}
}

@media only screen and (max-width: 1023px) {
  .supportImg{width: 100%; order: -1; margin-bottom: 20px;}
  .supportImg img{width: 100%;}
  .supportCont{width: 100%;}
  .supportInfo{margin-top: 20px;}
}

/* spScroll */
.trainImg{margin-top: 30px;}
@media only screen and (max-width: 767px) {
  .spScroll{overflow-x: auto; -webkit-overflow-scrolling: touch;}
  .spScroll .imgTbl{width: 1000px; margin-bottom: 15px;}
}

/* Flow */
.flowItem{display: flex; justify-content: space-between; align-items: flex-start;}
.flowItem:not(:last-of-type){margin-bottom: 20px;}
.flowItem li:nth-of-type(1){font-size: 20px; line-height: 1.5; font-weight: bold; text-align: center; width: 100px; position: relative; background: #f2f2f2; padding: 10px 0;}
.flowItem li:nth-of-type(2){width: calc(100% - 130px);}
.flowTit{font-size: 20px; font-weight: bold;}

#ot .flowItem li:nth-of-type(1),
#ot .flowTit{color: #cfa67f;}
#pt .flowItem li:nth-of-type(1),
#pt .flowTit{color: #77a9cf;}
#kango .flowItem li:nth-of-type(1),
#kango .flowTit{color: #ca96a1;}

@media only screen and (max-width: 767px) {
  .flowItem li:nth-of-type(1){font-size: 18px; width: 75px;}  
  .flowItem li:nth-of-type(2){width: calc(100% - 90px); line-height: 1.6;}
  .flowTit{font-size: 18px;}
}

/* Study */
[class*="studyList"]{display: flex; flex-wrap: wrap; padding-bottom: 30px;}
[class*="studyList"] a{display: block; position: relative; overflow: hidden;}
[class*="studyList"] span{width: 35px; height: 35px; line-height: 35px; text-align: center; color: #fff; position: absolute; top: 0; left: 0; display: block; z-index: 1; font-size: 20px;}
[class*="studyList"] a:after{content: ''; position: absolute; bottom: 5px; right: 5px; background: url("../img/common/ic_plus.png") no-repeat top left/100% 100%; width: 34px; height: 34px; z-index: 1;}
[class*="studyList"] img{transition: .5s; width: 100%;}
[class*="studyList"] a:hover img{transform: scale(1.05); -webkit-transform: scale(1.05);}

#ot [class*="studyList"] span{background: #cfa67f;}
#pt [class*="studyList"] span{background: #77a9cf;}
#kango [class*="studyList"] span{background: #ca96a1;}

@media only screen and (min-width: 768px) {
  .studyList1 li{width: 31.7%; margin-bottom: 2.45%;}
  .studyList1 li:not(:nth-of-type(3n)){margin-right: 2.45%;}
  
  .studyList2{max-width: 665px; margin: 0 auto;}
  .studyList2 li{width: 48.13%; margin-bottom: 3.74%;}
  .studyList2 li:not(:nth-of-type(2n)){margin-right: 3.74%;}
}

@media only screen and (max-width: 767px) {
  [class*="studyList"] li{width: 48%; margin-bottom: 4%;}
  [class*="studyList"] li:not(:nth-of-type(2n)){margin-right: 4%;}
  [class*="studyList"] span{width: 26px; height: 26px; line-height: 26px; font-size: 16px;}
  [class*="studyList"] a:after{width: 28px; height: 28px; bottom: 3px; right: 3px;}
}

/* Area */
.areaMap{text-align: center; padding: 30px 0 50px;}
.areaList{display: flex; justify-content: space-between;}
.areaList li:nth-of-type(2) p{position: relative; padding-left: 1.5em;}
.areaList li:nth-of-type(2) p:before{content: '●'; position: absolute; top: 0; left: 0;}
.areaItem{margin-bottom: 30px;}

[class*="areaTit"]{font-weight: bold; line-height: 1.5; padding-bottom: 3px; margin-bottom: 10px;}
.areaTitBlue{border-bottom: 1px solid #009fe6; color: #009fe6;}
.areaTitPink{border-bottom: 1px solid #cb5194; color: #cb5194;}
.areaTitOrg{border-bottom: 1px solid #e3ac47; color: #e3ac47;}

@media only screen and (min-width: 768px) {
  .areaBox{display: flex; justify-content: space-between;}
  .areaCol{width: 48%;}
  .areaList li:nth-of-type(1){width: 85px;}
  .areaList li:nth-of-type(2){width: calc(100% - 85px);}
}

@media only screen and (max-width: 767px) {
  .areaList li:nth-of-type(1){width: 65px;}
  .areaList li:nth-of-type(2){width: calc(100% - 65px);}
}


/* jikohyouka */
.jikohyoukaItem { margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 20px;}
.jikohyoukaItem li { flex-basis: calc((100% - 20px) / 2);}
@media only screen and (max-width: 970px) {
  .jikohyoukaItem { display: block; text-align: center;}
  .jikohyoukaItem li { width: 100%; margin-bottom: 1.5rem;}
}

/* bnr */
.bnrAria { margin-top: 5rem;}

/* Modal */
.modal{background: #fff; padding: 30px; width: 100%; max-width: 480px; display: none;}
[class*="modalTit"]{font-size: 20px; line-height: 1.5; font-weight: bold; position: relative; padding-left: 46px; margin-bottom: 10px;}
[class*="modalTit"] span{width: 30px; height: 30px; line-height: 30px; text-align: center; color: #fff; font-size: 25px; position: absolute; top: 0; left: 0; display: block;}
.moalClose{width: 120px; height: 30px; line-height: 30px; text-align: center; color: #fff; background: #000; letter-spacing: 0.1em; display: block; margin: 20px auto 0; cursor: pointer;}
.modal .fancybox-button{display: none !important;}

.modalTit-ot span{background: #cfa67f;}
.modalTit-pt span{background: #77a9cf;}
.modalTit-kango span{background: #ca96a1;}

@media only screen and (max-width: 767px) {
  .modal{padding: 20px;}
  [class*="modalTit"]{font-size: 18px; padding-left: 40px;}
  [class*="modalTit"] span{width: 28px; height: 28px; line-height: 28px; font-size: 22px;}
}