.taiken_detail{
margin-bottom:100px;
}

.taiken_detail .title{
font-size:2.5em;
font-weight:bold;
text-align:center;
margin-top:50px;
}

.taiken_detail .lead{
font-weight:bold;
font-size:1.25em !important;
margin-bottom:20px;
line-height:150%;
}

.taiken_detail .title02{
font-size:21px;
font-weight:bold;
text-align:center;
margin:70px auto 20px;
background:linear-gradient(transparent 60%, #ff6 60%);
display:inline-block;
}

.taiken_detail .title02_1{
font-size:1.3em;font-weight:bold;
margin:30px 0;
text-align:center;
}

.taiken_detail .goyoyaku{
font-size:21px;
font-weight:bold;
text-align:center;
margin:70px auto 20px ;
background:linear-gradient(transparent 60%, #ff6 60%);
display:inline-block;
}

.taiken_detail .goyoyaku_text{
text-align:center;
}

.taiken_detail .title03{
font-size:1.7em;
font-weight:bold;
text-align:center;
background-color:#000;
color:#fff;
padding:10px;
margin:70px 0 20px ;
}

.taiken_detail .flow{
font-size:1.2em;
}

.taiken_detail .flow > div .midashi{
font-weight:bold;
font-size:1.1em;
padding:10px;
}

.taiken_detail .flow > div .text{
text-align:left;
padding:10px;
}

.body_check{
text-align:center;
max-width:1000px;
margin:100px auto;
}

.body_check .flex{
display:flex;
justify-content:center;
align-items:center;
}

.body_check .blue div{
background-color:#004098;
font-size:1.5em;
color:#fff;
border-radius:50%;
margin:20px;
padding:5px;
width: 200px;
	height: 200px;
	display: flex; /* フレックスボックスを使用 */
      justify-content: center; /* 水平方向の中央揃え */
      align-items: center; /* 垂直方向の中央揃え */

}

@media screen and (max-width:959px){
.body_check .blue div{
width: 120px;
height: 120px;
font-size:0.8em;
margin:20px 5px;
}
}


.modal-wrapper {
  z-index: 999;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 40px 10px;
  text-align: center;
  margin-top:50px;
}

.modal-button {
    color: #4f96f6;
    background-color: #eeeeee;
    font-weight: bold;
    text-align: center;
    cursor :pointer;
    transition: all 0.3s;
    display: block;
    margin-top: 40px;
    margin-bottom: 1px;
    padding: 12px 2px;
    max-width:300px;
    text-decoration: none;
}

.modal-button:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(2px);
  transform: translateY(2px);/*下に動く*/

}


/*ラベルホバー時*/
.modal-button:hover {
  color: #FFFFFF;
  background-color: #4f96f6;
  transition: .6s;
}

.modal-wrapper:not(:target) {
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
}

.modal-wrapper:target {
  opacity: 1;
  visibility: visible;
  transition: opacity .4s, visibility .4s;
}

.modal-wrapper::after {
  display: inline-block;
  height: 100%;
  margin-left: -.05em;
  vertical-align: middle;
  content: ""
}

.modal-wrapper .modal-window {
  box-sizing: border-box;
  display: inline-block;
  z-index: 20;
  position: relative;
  width: 70%;
  max-width: 600px;
  padding: 10px 30px 25px;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 0 30px rgba(0, 0, 0, .6);
  vertical-align: middle
}

.modal-wrapper .modal-window .modal-content {
  max-height: 80vh;
  overflow-y: auto;
  text-align: left
}


/* h2 プライマリカラー*/
.modal_title:before{
	border-bottom: 4px solid #6bb6ff;
	width: 100%;
}
/* h2 セカンダリカラー*/
.modal_title:after{
	border-bottom: 4px solid #c8e4ff;
	width: 100%;
}

.modal-content p {
  margin: 10px 0 0 0;
}

.modal-overlay {
  z-index: 10;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, .8)
}

.modal-wrapper .modal-close {
  z-index: 20;
  position: absolute;
  top: 5px;
  right: 5px;
  width: 50px;
  color: #fff !important;
  background-color:#D70545;
  border:5px #fff solid;
  border-radius:50px;
  font-size: 40px;
  font-weight: 700;
  line-height: 50px;
  text-align: center;
  text-decoration: none;
  text-indent: 0
}

.modal-wrapper .modal-close:hover {
  color: #2b2e38 !important
}

.modal-wrapper .border{
border:2px green solid;
margin:5%;
max-width:800px;
padding: 5%;
}

.modal-wrapper .title{
font-size:1.2em;
margin-top:0;
padding-top:0
}

.modal-wrapper .flex div{
width:50%;
padding:2%;
}

.form_button{
background-color:#D70545;
color:#fff;
font-size:1.2em;
padding:20px;
border-radius:20px;
max-width:400px;
margin:0 auto;
}

.form_button a{
color:#fff;
}


@media screen and (min-width:960px){

.taiken_detail .vsp{
display:none;
}

.taiken_detail .w35{
width:35% !important;
}

.taiken_detail .w65{
width:65% !important;
}

.taiken_detail img{
max-width:800px;
margin:0 auto;
text-align:center;
}

.taiken_detail .photos{
display:flex;
justify-content:center;
flex-wrap: wrap;
text-align:center;
}

.taiken_detail .photos > div{
width:33%;
padding:10px;
}

.taiken_detail .flow{
display:flex;
justify-content:center;
text-align:center;
}

.taiken_detail .flow > div{
width:25%;
padding:10px;
}

}

@media screen and (max-width:959px){

.taiken_detail .vpc{
display:none;
}

.taiken_detail{
font-size:1.2em;
}

.taiken_detail .photos{
display:flex;
justify-content:center;
flex-wrap: wrap;
text-align:center;
}

.taiken_detail .photos > div{
width:33%;
padding:10px;
}

.taiken_detail .flow{
display:flex;
justify-content:center;
flex-direction:column;
text-align:center;
}

.taiken_detail .flow > div{
padding:10px;
font-size:1.2em;
}

}
