@charset "utf-8";
/* 入局.研修について -TRAINING-*/
/* 研修の流れ（カリキュラム）index*/
#wrap {
/* background: #ffffff; */
font-size: 1rem;
}
h2 {
background-image: url(../training/img/tit_training.jpg);
background-size: cover;
background-position-x:  100%;
}
.content {
padding-bottom: 20px;
}
.conBox2 {
background: #ffffff;
width: 100%;
margin: 0 auto;
display: block;
max-width: 1100px;
padding-top: 0;
/*! text-align: center; */
}
.mTit {
font-size: 3rem;
width: 95%;
max-width: 1100px;
margin: 65px auto 30px 0;
line-height: 15px;
}
.mTit span span {
font-size: 1.75rem;
left: 0;
}
.sTit {
margin-bottom: 20px;
}
.titunder{
margin-bottom: 80px;
width: 100%;
}
.trainingBtn {
background: -webkit-linear-gradient(225deg, #6cc3a1, #83d0c5);
background: -o-linear-gradient(225deg, #6cc3a1, #83d0c5);
background: linear-gradient(-135deg, #6cc3a1, #83d0c5);
width: 530px;
height: 60px;
margin: 20px auto 0;
text-align: center;
font-size: 1rem;
position: relative;
box-sizing: border-box;
border: solid 1px #ffffff;
}
.trainingBtn:hover {
background: #ffffff;
border: solid 2px #30adb5;  
}
.trainingBtn>a {
color: #ffffff;
width: 100%;
display: inline-block;
height: 60px;
line-height: 60px;
margin: 0;
}
.trainingBtn a:hover {
opacity: 1;
color: #30adb5;
}

.trainingBtn>a>span {
font-weight: bolder;
position: absolute;
right: 20px;
}
.conBox2 section.trainingCurBox{
width: 100%;
margin: 0 auto;
/*!   display: -webkit-box; /*Android4.3*/
/*display: -moz-box;*/    /*Firefox21*/
/*display: -ms-flexbox;*/ /*IE10*/
/*display: -webkit-flex;*/ /*PC-Safari,iOS8.4*/
/*display: flex*/
/*!   -ms-flex-wrap: wrap;
flex-wrap: wrap; */
/*! -webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between; */
line-height: 30px;
font-size: 1rem;
margin: 0 0 50px;
box-sizing: border-box;
text-align: left; 
}

.trainingCurBoxItem h4 {
/* font-size: 1.125rem; */
margin-bottom: 20px;
margin-right: -20px;
/*! position: absolute; */
/* top: -40px; */
/*! left: 20px; */
/*! text-indent: 15px; */
font-weight: bold;
display: inline-block;
width: inherit;
box-sizing: content-box;
margin: 0 auto;
white-space: nowrap;
}
.conBox2 .trainingCurBox img{
max-width: 326px;
float: left;
margin: 8px 10px 20px 0;
}

.traImg01 {
float: right;
}

.trainingCurBox .sTit {
font-size: 1.875rem;
margin-bottom: 40px;
/*! text-align: left; */
}
.trainingCurBox .sTit br {
}
.trainingCurBox p {
}
.trainingCurBox p br {
}
.trainingCurBox img {
}

.trainingCurBox2 .sTit {
font-size: 1.875rem;
margin-bottom: 50px;
margin-top: 85px;
text-align: left;
}
.trainingCurBox2>dl {
/*   border: solid 1px #000000; */
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
box-sizing: border-box;
font-weight: bolder;
font-size: 1rem;
text-align: left;
width: 100%;
}
.trainingCurBox2>dl:nth-of-type(2),.trainingCurBox2>dl:nth-of-type(3) {
margin-top: -1px;
}

.trainingCurBox2>dl>dt {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: solid 1px #d4cdcd;
background: #e6f4f2;
width: 20%;
}
.trainingCurBox2>dl:nth-of-type(2)>dt {
background: #e3f5df;
}
.trainingCurBox2>dl>dd {
-webkit-box-flex: 4;
-ms-flex: 4;
flex: 4;
border: solid 1px #d4cdcd;
margin-left: -1px;
padding: 20px;
font-size: 1.25rem;
width: 80%;
}
.trainingCurBox2 dl div {
background: #e6f4f2;
border: solid 1px #d4cdcd;
position: relative;
margin-top: 20px;
padding: 30px;
font-size: 1rem;
width: 90%;
}
.trainingCurBox2 dl div>dl{
position: relative;
width: 100%;
}
.trainingCurBox2 dl div>dl:nth-of-type(2){
margin-top:20px; 
}
.trainingCurBox2 dl div dl dt{
position: absolute;
/*! left: -10px; */
}
.trainingCurBox2 dl div dl dd{
margin-left: 80px;
font-weight: initial;
}
.trainingCurBox2 dl div dl dd li{
margin-right: 3rem;
/*! display: inline-block; */
}

.trainingCurBox2 dl span {
position: absolute;
top: -15px;
text-shadow: 2px 2px 0 #ffffff;
color: #79c7a8;
font-size: 1.25rem;
}
.trainingCurBox2 dl div ul {
list-style: disc;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
}
.trainingCurBox2 dl:nth-of-type(3) div ul {
display: block;
}
.trainingCurBox2 dl div>ul>li {
width: 32%;
/*   ! display: inline-block; */
font-weight: initial;
/*! display: inline-block; */
margin-right: 10px; 
min-width: 220px;
display: inline-block;
}
.trainingCurBox2 dl div>ul>li:first-of-type {
width: 70%;
}
.trainingCurBox2 dl div>ul>li:nth-of-type(even) {
width: 60%;
min-width: 400px;
}

.trainingCurBox3 {
}
.trainingCurBox3 .sTit {
font-size: 1.875rem;
margin-top: 140px;
text-align: left;
}
.trainingCurBox3 dt {
}
.trainingCurBox3 dd {
}
.trainingCurBox3 dl {
}
.trainingCurBox3 dl dt {
}
.trainingCurBox3 dl br {
}
.trainingCurBox3 dl dd {
}
.trainingCurBox3>dl {
box-sizing: border-box;
font-weight: bolder;
font-size: 1rem;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
position: relative;
margin-bottom: 60px; 
}
.trainingCurBox3>dl:nth-of-type(2),.trainingCurBox2>dl:nth-of-type(3) {
margin-top: -1px;
}

.trainingCurBox3>dl>dt {
width: 30%;
height: 100%;
position: absolute;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: solid 1px #aaaaaa;
background: #e6f4f2;

}
.trainingCurBox3>dl>dt:before {
content: "";
position: absolute;
top: 50%;
left: 100%;
left: -webkit-calc(100% + 1px);
left: calc(100% + 1px);
margin-top: -15px;
border: 15px solid transparent;
border-left: 15px solid #888888;
}

.trainingCurBox3>dl>dt:after {
content: "";
position: absolute;
top: 50%;
left: 100%;
margin-top: -15px;
border: 15px solid transparent;
border-left: 15px solid #e6f4f2;
}


.trainingCurBox3>dl:nth-of-type(2)>dt {
background: #e3f5df;
}
.trainingCurBox3>dl>dd {
margin-left: 35%;
width: 65%;
/*   border: solid 1px #000000; */
background: #eeeeee;
padding: 20px;
font-size: 1rem;
}
.trainingCurBox3>dl>dd:nth-of-type(even) {
background: #ffffff;
}
.trainingCurBox3 dl div {
background: #e6f4f2;
border: solid 1px #d4cdcd;
position: relative;
margin-top: 20px;
padding: 30px;
font-size: 1rem;
}
.trainingCurBox3 dl div>dl{
position: relative;
}
.trainingCurBox3 dl div>dl:nth-of-type(2){
margin-top:20px; 
}
.trainingCurBox3 dl div dl dt{
position: absolute;
}
.trainingCurBox3 dl div dl dd{
margin-left: 150px;
display: list-item;
list-style-type: disc;
}

.trainingCurBox3 dl span {
position: absolute;
top: -15px;
text-shadow: 2px 2px 0 #ffffff;
color: #79c7a8;
font-size: 1.25rem;
}
.trainingCurBox3 dl div ul {
list-style: disc;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.trainingCurBox3 dl div li {
width: 40%;
/*! display: inline-block; */
}
.trainingCurBox3 dl div li:nth-of-type(even) {
width: 60%;
}




@media screen and (min-width: 1200px) {
.gNav li:nth-child(4) > a{
border-bottom: solid 3px #30adb5;
}

}
/* PC ------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
.trainingCurBox2 dl:nth-of-type(2) div dl dd li:nth-of-type(odd){
width: 35%;
margin-right: 0;
display: inline-block;
}
.trainingCurBox2 dl div dl dd li:nth-of-type(even){
width: 60%;
margin-right: 0;
display: inline-block;
}
.trainingCurImg {
max-width: 1100px;
}
.trainingCurImg img {
margin-right: auto;
margin-left: auto;
width: 100%;
height: auto;
}
.End {
margin-bottom: 70px;
}
.trainingScrollTxt {
display: none;
}
}

/* スマートフォン ------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
.content {
padding-bottom: 90px;
}
.mTit {
margin: 0 auto 20px;
font-size: 1.75rem;
width: 100%;
line-height: initial;
}
.mTit span span {
font-size: 1rem;
left: 0;
}
.trainingCurBox .sTit {
font-size: 1.375rem;
margin-top: 10px;
margin-bottom: 20px;
}
.conBox2 .trainingCurBox img{
max-width: 326px;
float: initial;
margin: 15px auto;
display: block;
width: 80%;
}
.traImg01 {
max-width: 326px;
float: initial;
margin: 15px auto;
display: block;
width: 80%;
}
.trainingCurBox3 .sTit {
font-size: 1.375rem;
margin-top: 40px;
text-align: left;
}
.conBox2{
text-align: center;
}
.conBox2 section.trainingCurBox{
width: 100%;
margin: 0 auto 40px;
display: block;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
} 
.conBox2 .trainingCurBoxItem{
width: 100%;
max-width: inherit;
margin: 0 auto 70px;
/*! border: solid 1px #d4cdcd; */
box-sizing: border-box;
text-align: left; 
position: relative;
}
.mTit span span {
font-size: 1rem;
left: 0;

padding-left: 0;
margin-right: 0;
}  

.trainingCurBoxItem .sTit {
display: block;
box-sizing: content-box;
margin: 0 auto;
}


.trainingBtn {
width: 100%;
height: 60px;
}   

.content img.titunder{
margin-bottom: 30px;
width: 100%;
}

.conBox2{
width: 100%;
/*! white-space:nowrap; */
/*! overflow-x: scroll; */
padding-bottom: 10px;
}


.trainingCurBox2 {
margin-bottom: 50px;
}

.trainingCurBox2 .sTit {
font-size: 1.375rem;
margin-bottom: 20px;
margin-top: 00px;
text-align: left;
}

.trainingCurBox2>dl {
/*   border: solid 1px #000000; */
display: initial;
box-sizing: border-box;
font-weight: bolder;
font-size: 1rem;
text-align: left;
}

.trainingCurBox2>dl:nth-of-type(2),.trainingCurBox2>dl:nth-of-type(3) {
margin-top: 0px;
}

.trainingCurBox2>dl>dt {
flex: initial;
display: block;
justify-content: inherit;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: solid 1px #d4cdcd;
background: #e6f4f2;
padding: 20px;
width: 100%;
box-sizing: border-box;
}
.trainingCurBox2>dl:nth-of-type(2)>dt,.trainingCurBox2>dl:nth-of-type(3)>dt {
background: #e3f5df;
margin-top: -1px;
}
.trainingCurBox2>dl>dd {
flex: 4;
border: solid 1px #d4cdcd;
margin-left: initial;
padding: 20px;
font-size: 1.25rem;
margin-top: -1px;
width: 100%;
box-sizing: border-box;
}
.trainingCurBox2 dl div {
background: #e6f4f2;
border: solid 1px #d4cdcd;
position: relative;
margin-top: 20px;
padding: 30px 5%;
font-size: 1rem;
}
.trainingCurBox2 dl div>dl{
position: relative;
}
.trainingCurBox2 dl div>dl:nth-of-type(2){
margin-top:20px; 
}
.trainingCurBox2 dl div dl dt{
position: initial;
}
.trainingCurBox2 dl div dl dd{
margin-left: 0;
/*! display: list-item; */
/*! list-style-type: disc; */
}
.trainingCurBox2 dl span {
position: absolute;
top: -15px;
text-shadow: 2px 2px 0 #ffffff;
color: #79c7a8;
font-size: 1.25rem;
}
.trainingCurBox2 dl div ul {
list-style: disc;
display: block;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: 10px;
}
.trainingCurBox2 dl div li {
width: 100%;
/*! display: inline-block; */
}
.trainingCurBox2 dl div li:nth-of-type(even) {
width: initial;
}

.trainingCurBox2 dl div dl dd li{
margin-right: 0;
}

.trainingCurBox2 dl div>ul>li {
width: 100%;
/*   ! display: inline-block; */
font-weight: initial;
/*! display: inline-block; */
margin-right: 10px; 
min-width: initial;
}
.trainingCurBox2 dl div>ul>li:first-of-type {
width: 100%;
}
.trainingCurBox2 dl div>ul>li:nth-of-type(even) {
width: 100%;
min-width: initial;
}  


.trainingCurBox3>dl {
box-sizing: border-box;
font-weight: bolder;
font-size: 1rem;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
position: relative;
margin-bottom: 30px; 
}
.trainingCurBox3>dl:nth-of-type(2),.trainingCurBox2>dl:nth-of-type(3) {
margin-top: -1px;
}

.trainingCurBox3>dl>dt {
width: 100%;
height: 100%;
position: relative;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border: solid 1px #aaaaaa;
background: #e6f4f2;

padding: 10px;
margin-bottom: 30px;
box-sizing: border-box;
}


.trainingCurBox3>dl:nth-of-type(2)>dt {
background: #e3f5df;
}
.trainingCurBox3>dl>dd {
margin-left: 0;
width: 100%;
/*   border: solid 1px #000000; */
background: #eeeeee;
padding: 20px;
font-size: 1rem;
box-sizing: border-box;
}
.trainingCurBox3>dl>dd:nth-of-type(even) {
background: #ffffff;
}
.trainingCurBox3 dl div {
background: #e6f4f2;
border: solid 1px #d4cdcd;
position: relative;
margin-top: 20px;
padding: 30px;
font-size: 1rem;
}
.trainingCurBox3 dl div>dl{
position: relative;
}
.trainingCurBox3 dl div>dl:nth-of-type(2){
margin-top:20px; 
}
.trainingCurBox3 dl div dl dt{
position: absolute;
}
.trainingCurBox3 dl div dl dd{
margin-left: 150px;
display: list-item;
list-style-type: disc;
}

.trainingCurBox3 dl span {
position: absolute;
top: -15px;
text-shadow: 2px 2px 0 #ffffff;
color: #79c7a8;
font-size: 1.25rem;
}
.trainingCurBox3 dl div ul {
list-style: disc;
display: -webkit-box; /*Android4.3*/
display: -moz-box;    /*Firefox21*/
display: -ms-flexbox; /*IE10*/
display: -webkit-flex; /*PC-Safari,iOS8.4*/
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.trainingCurBox3 dl div li {
width: 40%;
/*! display: inline-block; */
}
.trainingCurBox3 dl div li:nth-of-type(even) {
width: 60%;
}


.trainingCurBox3>dl>dt:before {
content: "";
position: absolute;
top: calc(100% + 16px);
left: inherit;
margin-top: -15px;
border: 15px solid transparent;
/* 	border-left: 15px solid #888888; */
border-top: 15px solid #888888;
border-right: 15px solid transparent;
border-left: 15px solid transparent;
}

.trainingCurBox3>dl>dt:after {
content: "";
position: absolute;
top: calc(100% + 15px);
left: inherit;
margin-top: -15px;
border: 15px solid transparent;
border-top: 15px solid #e6f4f2;
border-right: 15px solid transparent;
border-left: 15px solid transparent;
}
.trainingCurImg img {
width: 850px;
height: auto;
}
/*スクロールバーの設定*/
.trainingCurImg {
margin-left: 10px;
margin-right: 10px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
/*バーの太さ*/
.trainingCurImg::-webkit-scrollbar {
height: 8px;
}
/*バーの背景色*/
.trainingCurImg::-webkit-scrollbar-track {
background: #dcdcdc;
box-shadow: inset 0 0 5px rgba(0, 0, 0, .1);
}
/*バーの色*/
.trainingCurImg::-webkit-scrollbar-thumb{
background-color: #34afb1;
box-shadow: 0 0 0 1px rgba(255, 255, 255, .3);
border-radius: 8px;
}
.trainingScrollTxt {
font-size: 88%;
background: url(../training/img/icon_scroll.png) no-repeat center left;
background-size: 33px;
padding-left: 30px;
margin-left: 5px;
margin-bottom: 10px;
}
}











