@charset "utf-8";

/*  +++++++++++++++++++++++++ common +++++++++++++++++++++++++ */

#co #mainContents #tmpuPage{
margin: 0;
padding: 30px 0 0;
}
#co #mainContents #tmpuPage #tmpuTitleBox{
margin: 0 auto 30px;
padding: 0;
width: 1100px;
position: relative;
text-align: left;
}
#co #mainContents #tmpuPage #tmpuTitleBox h1{
margin: 0;
padding: 0;
font-size: 2.2rem;
line-height: 1.3;
}
#co #mainContents #tmpuPage #tmpuTitleBox p.name{
margin: 0;
padding: 0;
font-size: 3.8rem;
line-height: 0.8;
font-style: italic;
position: absolute;
right: 0;
top: 20px;
}
#co #mainContents #tmpuPage #tmpuMainBox{
margin: 0 auto 100px;
padding: 0;
width: 1100px;
text-align: right;
}
#co #mainContents #tmpuPage #tmpuMainBox > .inner{
margin: 0;
padding: 0;
width: 970px;
position: relative;
display: inline-block;
text-align: left;
}
#co #mainContents #tmpuPage #tmpuMainBox > .inner:before{
margin: 0;
padding: 0;
content: "";
display: inline-block;
width: 42px;
height: 90px;
background: url("../tmpu/img/main_flow.png") no-repeat center center;
background-size: contain;
position: absolute;
left: 50%;
bottom: -40px;
transform: translateX(-50%);
mix-blend-mode: screen;
}
#co #mainContents #tmpuPage #tmpuMainBox p.photo{
margin: 0;
padding: 0;
}
#co #mainContents #tmpuPage #tmpuMainBox p.catch{
margin: 0;
padding: 0;
font-size: 1.6rem;
line-height: 2.0;
color: #FFF;
position: absolute;
top: 80px;
text-shadow: 0 0 9px rgba(0, 0, 0, 0.8);
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox{
margin: 0;
padding: 0;
background: rgba(229,213,0,0.9);
display: inline-block;
position: absolute;
bottom: -30px;
color: #231815;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox > .inner{
margin: 0;
padding: 30px 50px;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox p.sub{
margin: 0 0 15px;
padding: 3px 5px;
font-size: 0.75rem;
line-height: 1.3;
display: inline-block;
border: solid 1px #231815;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox h2{
margin: 0;
padding: 0;
font-size: 1.2rem;
line-height: 1.4;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox h2 strong{
font-size: 1.6rem;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox h2 span.en{
margin: 0;
padding: 0;
font-size: 0.75rem;
display: block;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox p.txt{
margin: 30px 0 0;
padding: 0;
font-size: 0.75rem;
line-height: 1.6;
position: relative;
}
#co #mainContents #tmpuPage #tmpuMainBox #profileBox p.txt:before{
margin: 0;
padding: 0;
content: "";
display: inline-block;
width: 30px;
height: 2px;
position: absolute;
left: 0;
top: -15px;
background-color: #231815;
}
#co #mainContents #tmpuPage #qaBox{
margin: 0;
padding: 0;
}
#co #mainContents #tmpuPage #qaBox .box{
margin: 0;
padding: 0;
}
#co #mainContents #tmpuPage #qaBox .box > .inner{
margin: 0 auto;
padding: 80px 0;
width: 1100px;
display: flex;
align-items:flex-start;
}
#co #mainContents #tmpuPage #qaBox .box.photoL > .inner{
flex-direction:row-reverse;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox{
margin: 0;
padding: 0;
width: 100%;
text-align: left;
}
#co #mainContents #tmpuPage #qaBox .box.photoR .txtBox{
margin: 0 40px 0 0;
width: 530px;
}
#co #mainContents #tmpuPage #qaBox .box.photoL .txtBox{
margin: 0 0 0 40px;
width: 530px;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox h2{
margin: 0 0 20px;
padding: 0;
font-size: 0;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox h2 span{
margin: 0;
padding: 0;
font-size: 5.0rem;
line-height: 1.0;
display: inline-block;
vertical-align: middle;
width: 130px;
font-weight: 500;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox h2 strong{
margin: 0;
padding: 0;
font-size: 1.6rem;
line-height: 1.6;
display: inline-block;
vertical-align: middle;
width: calc(100% - 130px);
font-weight: 500;
}
#co #mainContents #tmpuPage #qaBox .box.photoR .txtBox h2 span,
#co #mainContents #tmpuPage #qaBox .box.photoL .txtBox h2 span{
margin-bottom: 10px;
display: block;
width: auto;
}
#co #mainContents #tmpuPage #qaBox .box.photoR .txtBox h2 strong,
#co #mainContents #tmpuPage #qaBox .box.photoL .txtBox h2 strong{
display: block;
width: auto;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox p{
margin: 0 0 0 130px;
padding: 0;
font-size: 1.0rem;
line-height: 1.8;
}
#co #mainContents #tmpuPage #qaBox .box .txtBox p.catch{
margin: 0 0 30px 130px;
padding: 0;
font-size: 2.2rem;
line-height: 1.5;
font-weight: 900;
}
#co #mainContents #tmpuPage #qaBox .box.photoR .txtBox p,
#co #mainContents #tmpuPage #qaBox .box.photoL .txtBox p,
#co #mainContents #tmpuPage #qaBox .box.photoR .txtBox p.catch,
#co #mainContents #tmpuPage #qaBox .box.photoL .txtBox p.catch{
margin-left: 0;
}
#co #mainContents #tmpuPage #qaBox .box .photoBox{
margin: 0;
padding: 0;
width: 530px;
position: relative;
}
#co #mainContents #tmpuPage #qaBox .box .photoBox p{
margin: 0;
padding: 15px;
position: relative;
z-index: 10;
}
#co #mainContents #tmpuPage #qaBox .box .photoBox:before,
#co #mainContents #tmpuPage #qaBox .box .photoBox:after{
margin: 0;
padding: 0;
width: 80%;
height: 40%;
content: "";
display: inline-block;
position: absolute;
z-index: 5;
}
#co #mainContents #tmpuPage #qaBox .box .photoBox:before{
left: 0;
bottom: 0;
}
#co #mainContents #tmpuPage #qaBox .box .photoBox:after{
right: 0;
top: 0;
}
#co #mainContents #tmpuPage #qaBox .imgBox{
margin: 0;
padding: 0;
width: 100%;
}
#co #mainContents #tmpuPage #qaBox .imgBox img{
width: 100%;
height: auto;
}



/*  +++++++++++++++++++++++++ color variation +++++++++++++++++++++++++ */

/* c01 */

#co #mainContents #tmpuPage.c01 #tmpuTitleBox h1{
color: #EC6D81;
}
#co #mainContents #tmpuPage.c01 #qaBox .box{
background: #FDF2F7;
}
#co #mainContents #tmpuPage.c01 #qaBox .box:nth-child(2n){
background: #F7E9EF;
}
#co #mainContents #tmpuPage.c01 #qaBox .box .photoBox:before{
background-color: #52A8C1;
}
#co #mainContents #tmpuPage.c01 #qaBox .box .photoBox:after{
background-color: #E39EBD;
}
#co #mainContents #tmpuPage.c01 #qaBox .box .txtBox h2{
color: #EC6D81;
}

/* c02 */

#co #mainContents #tmpuPage.c02 #tmpuTitleBox h1{
color: #235994;
}
#co #mainContents #tmpuPage.c02 #qaBox .box{
background: #EAEDF7;
}
#co #mainContents #tmpuPage.c02 #qaBox .box:nth-child(2n){
background: #DFE2EF;
}
#co #mainContents #tmpuPage.c02 #qaBox .box .photoBox:before{
background-color: #89B59D;
}
#co #mainContents #tmpuPage.c02 #qaBox .box .photoBox:after{
background-color: #9FA0A0;
}
#co #mainContents #tmpuPage.c02 #qaBox .box .txtBox h2{
color: #235994;
}

/* c03 */

#co #mainContents #tmpuPage.c03 #tmpuTitleBox h1{
color: #F3981C;
}
#co #mainContents #tmpuPage.c03 #qaBox .box{
background: #FFF6E9;
}
#co #mainContents #tmpuPage.c03 #qaBox .box:nth-child(2n){
background: #FFF;
}
#co #mainContents #tmpuPage.c03 #qaBox .box .photoBox:before{
background-color: #83C0EA;
}
#co #mainContents #tmpuPage.c03 #qaBox .box .photoBox:after{
background-color: #86CAB4;
}
#co #mainContents #tmpuPage.c03 #qaBox .box .txtBox h2{
color: #F3981C;
}

/* c04 */

#co #mainContents #tmpuPage.c04 #tmpuTitleBox h1{
color: #7A6A56;
}
#co #mainContents #tmpuPage.c04 #qaBox .box{
background: #F5F2EC;
}
#co #mainContents #tmpuPage.c04 #qaBox .box:nth-child(2n){
background: #EDE8DD;
}
#co #mainContents #tmpuPage.c04 #qaBox .box .photoBox:before{
background-color: #C9A063;
}
#co #mainContents #tmpuPage.c04 #qaBox .box .photoBox:after{
background-color: #6A9BB2;
}
#co #mainContents #tmpuPage.c04 #qaBox .box .txtBox h2{
color: #7A6A56;
}

/* c05 */

#co #mainContents #tmpuPage.c05 #tmpuTitleBox h1{
color: #00AC97;
}
#co #mainContents #tmpuPage.c05 #qaBox .box{
background: #EFF5F2;
}
#co #mainContents #tmpuPage.c05 #qaBox .box:nth-child(2n){
background: #D5EAE1;
}
#co #mainContents #tmpuPage.c05 #qaBox .box .photoBox:before{
background-color: #006730;
}
#co #mainContents #tmpuPage.c05 #qaBox .box .photoBox:after{
background-color: #B5D469;
}
#co #mainContents #tmpuPage.c05 #qaBox .box .txtBox h2{
color: #00AC97;
}


/*  +++++++++++++++++++++++++ main position variation +++++++++++++++++++++++++ */

#co #mainContents #tmpuPage #tmpuMainBox.right p.catch{
right: 80px;
}
#co #mainContents #tmpuPage #tmpuMainBox.left p.catch{
left: 80px;
}
#co #mainContents #tmpuPage #tmpuMainBox.right #profileBox{
right: 80px;
}
#co #mainContents #tmpuPage #tmpuMainBox.left #profileBox{
left: 80px;
}


/*  +++++++++++++++++++++++++ originalPage style (activities) +++++++++++++++++++++++++ */

#co #mainContents #tmpuPage.activities #tmpuMainBox > .inner{
width: 100%;
}
#co #mainContents #tmpuPage.activities #tmpuMainBox p.catch{
margin: 0;
padding: 18px 35px;
font-size: 1.6rem;
line-height: 1.8;
color: #FFF;
background: #F6AF49;
position: absolute;
top: -20px;
left: 50%;
transform: translateX(-50%);
text-shadow: none;
display: inline-block;
}
#co #mainContents #tmpuPage.activities #readTxtBox{
margin: 0 0 80px;
padding: 0;
text-align: center;
}
#co #mainContents #tmpuPage.activities #readTxtBox p{
margin: 0;
padding: 0;
font-size: 1.6rem;
line-height: 2.0;
display: inline-block;
text-align: left;
color: #F3981C;
}
#co #mainContents #tmpuPage.activities #profileBox{
margin: 0 auto 80px;
padding: 0;
width: 1100px;
text-align: left;
}
#co #mainContents #tmpuPage.activities #profileBox ul{
margin: 0;
padding: 0;
font-size: 0;
}
#co #mainContents #tmpuPage.activities #profileBox ul li{
margin: 0 4% 0 0;
padding: 0;
font-size: 1.0rem;
display: inline-block;
width: 22%;
vertical-align: top;
}
#co #mainContents #tmpuPage.activities #profileBox ul li:last-child{
margin-right: 0;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.photo{
margin: 0 0 15px;
padding: 0;
position: relative;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.photo img{
width: 100%;
height: auto;
position: relative;
z-index: 10;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.photo:before{
margin: 0;
padding: 0;
width: 80%;
height: 80%;
content: "";
display: inline-block;
position: absolute;
z-index: 5;
left: -15px;
top: -15px;
z-index: 5;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.sub{
margin: 0 0 15px;
padding: 3px 5px;
font-size: 0.75rem;
line-height: 1.3;
display: inline-block;
border: solid 1px #231815;
}
#co #mainContents #tmpuPage.activities #profileBox ul li h2{
margin: 0;
padding: 0;
font-size: 1.2rem;
line-height: 1.4;
}
#co #mainContents #tmpuPage.activities #profileBox ul li h2 strong{
font-size: 1.6rem;
}
#co #mainContents #tmpuPage.activities #profileBox ul li h2 span.en{
margin: 0;
padding: 0;
font-size: 0.75rem;
display: block;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.txt{
margin: 30px 0 0;
padding: 0;
font-size: 0.75rem;
line-height: 1.6;
position: relative;
}
#co #mainContents #tmpuPage.activities #profileBox ul li p.txt:before{
margin: 0;
padding: 0;
content: "";
display: inline-block;
width: 30px;
height: 2px;
position: absolute;
left: 0;
top: -15px;
background-color: #231815;
}
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(1) p.photo:before,
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(2) p.photo:before{
background: #86CAB4;
}
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(1) h2,
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(2) h2{
color: #69BD83;
}
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(3) p.photo:before,
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(4) p.photo:before{
background: #83C0EA;
}
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(3) h2,
#co #mainContents #tmpuPage.activities #profileBox ul li:nth-of-type(4) h2{
color: #60B3E5;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox{
margin: 0;
padding: 0;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box{
margin: 0;
padding: 0;
background: #FFF6E9;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box > .inner{
margin: 0 auto;
padding: 60px 0;
width: 1100px;
display: flex;
align-items: flex-start;
position: relative;
z-index: 20;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box.fullImgBox > .inner{
padding-bottom: 0;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box.fullImgBox p.fullImg{
margin: 0 0 -150px;
padding: 0;
position: relative;
top: -150px;
z-index: 10;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box.fullImgBox p.fullImg img{
width: 100%;
height: auto;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox{
margin: 0;
padding: 0;
width: 50%;
text-align: left;
background: #FFF6E9;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox > .inner{
margin: 0;
padding: 40px;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox h2{
margin: 0 0 40px;
padding: 30px 40px 15px;
background: #FFF;
font-size: 1.2rem;
line-height: 1.6;
color: #F3981C;
position: relative;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox h2 span{
margin: 0;
padding: 0;
font-size: 3.0rem;
line-height: 1.0;
display: block;
font-weight: 500;
position: absolute;
top: -20px;
left: 40px;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox p.message{
text-align: center;
color: #898989;
font-size: 1.3rem;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox p span{
font-size: 1.2rem;
display: inline-block;
margin-right: 15px;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox p span.c01{
color: #69BD83;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox p span.c02{
color: #60B3E5;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox *:last-child{
margin-bottom: 0 !important;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox{
margin: 0 0 50px;
padding: 0;
position: relative;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox p{
margin: 0;
padding: 15px;
position: relative;
z-index: 10;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox:before,
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox:after{
margin: 0;
padding: 0;
width: 80%;
height: 40%;
content: "";
display: inline-block;
position: absolute;
z-index: 5;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox:before{
left: 0;
bottom: 0;
background: #83C0EA;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box .txtBox .photoBox:after{
right: 0;
top: 0;
background: #86CAB4;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box:nth-child(2n){
background: #FFF;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box:nth-child(2n) .txtBox{
background: #FFF;
}
#co #mainContents #tmpuPage.activities #activitiesInterviewBox .box:nth-child(2n) .txtBox h2{
background: #FFF6E9;
}



/*  +++++++++++++++++++++++++ originalPage style (interview) +++++++++++++++++++++++++ */

#co #mainContents #tmpuPage.interview #tmpuMainBox > .inner{
width: 100%;
}
#co #mainContents #tmpuPage.interview #youtubeBox{
margin: 0 auto 80px;
padding: 0;
width: 800px;
}
#co #mainContents #tmpuPage.interview #youtubeBox h2{
margin: 0 0 40px;
padding: 0;
text-align: center;
color: #7A6A56;
font-size: 1.5rem;
line-height: 1.6;
}
#co #mainContents #tmpuPage.interview #youtubeBox h2 span{
position: relative;
}
#co #mainContents #tmpuPage.interview #youtubeBox h2 span:before,
#co #mainContents #tmpuPage.interview #youtubeBox h2 span:after{
padding: 0;
content: "";
width: 1px;
height: 30px;
display: inline-block;
background: #7A6A56;
position: absolute;
top: 0;
}
#co #mainContents #tmpuPage.interview #youtubeBox h2 span:before{
left: -20px;
transform: rotate(-30deg);
}
#co #mainContents #tmpuPage.interview #youtubeBox h2 span:after{
right: -20px;
transform: rotate(30deg);
}
#co #mainContents #tmpuPage.interview #youtubeBox ul{
margin: 0;
padding: 0;
font-size: 0;
}
#co #mainContents #tmpuPage.interview #youtubeBox ul li{
margin: 0 6% 0 0;
padding: 0;
font-size: 1.0rem;
display: inline-block;
width: 47%;
vertical-align: top;
}
#co #mainContents #tmpuPage.interview #youtubeBox ul li:last-child{
margin-right: 0;
}
#co #mainContents #tmpuPage.interview #youtubeBox ul li p{
margin: 0;
padding: 0;
text-align: center;
color: #7A6A56;
font-size: 0.85rem;
line-height: 1.6;
}
#co #mainContents #tmpuPage.interview #youtubeBox ul li p.photo{
margin-bottom: 10px;
}
#co #mainContents #tmpuPage.interview #readTxtBox{
margin: 0;
padding: 0;
background: #EDE8DD;
}
#co #mainContents #tmpuPage.interview #readTxtBox > .inner{
margin: 0 auto;
padding: 80px 0;
width: 1100px;
text-align: center;
}
#co #mainContents #tmpuPage.interview #readTxtBox p{
margin: 0;
padding: 0;
font-size: 1.6rem;
line-height: 2.0;
display: inline-block;
text-align: left;
color: #7A6A56;
}


/*  +++++++++++++++++++++++++ originalPage style (interview_02) +++++++++++++++++++++++++ */

#co #mainContents #tmpuPage.interview_02 #readTxtBox{
margin: 0 0 80px;
padding: 0;
text-align: center;
}
#co #mainContents #tmpuPage.interview_02 #readTxtBox p{
margin: 0;
padding: 0;
font-size: 1.6rem;
line-height: 2.0;
display: inline-block;
text-align: left;
color: #235994;
}
#co #mainContents #tmpuPage.interview_02 .name01{
color: #1164BF;
font-weight: 900;
}
#co #mainContents #tmpuPage.interview_02 .name02{
color: #C52077;
font-weight: 900;
}