@charset "utf-8";

#contents{
	background: #fff;
	font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	color: #231815;
	text-align: center;
	padding: 0;
	font-size: 14px;
	line-height: 1.6;
}
#contents .inner {
	width: 100%;
}
/*
.container-wrap {
	min-width: auto;
}
*/
.display-sp {
	display: none;
}
.display-pc {
	display: block;
}
a {
	color: #0025D7;
	text-decoration: underline;
}
.b{
    font-weight: bold;}

.blue{
    color:#1da1f2;
}
/* ============== 全体、box =================== */
.content-wrap {
	 background: repeating-linear-gradient(45deg, #f2f2f2 0, #f2f2f2 20px, #e6e6e6 20px, #e6e6e6 40px);
}
.sec-box {
    width: 95%;
    margin:0 auto;
    max-width: 980px;
}
.sec-box02 {
    margin:0 auto;
    background:#ffffff;
    padding:20px 0;
}

.boxin{
    position: relative;
    margin: -120px 0 20px 0;
}
.box01{
    padding: 0 10px;
    text-align: center;
    background: #ffffff;
    width: 43%;
    margin: 5px;
    border-radius: 10px;
    display: inline-block;
    vertical-align: top;
    height: 500px;
    border: 1px solid #2d2d2d;
}

.linktxt{
    margin:10px 0;
    line-height: 1.7em;
}
.sec-btn img{
    position: relative;
    margin:-50px 0 0 -20px ;
}
.sec_tit{
    font-weight: bold;
    font-size:1.2vw;
    padding:0;
    line-height: 1.2em;
    }
.step_img{
    margin:15px 0 10px 0;
}
.step_imgSP{
    margin:0 auto;
    width:85%;
}
.step_img img{
    margin:0 -25px 0 0;
    position: relative;
}

/* ========= flow ========= */
.col3 {
max-width: 1120px;
text-align: center;
position: relative;
margin: 30px auto;
}
.col3 li {
	width: 27%;
	vertical-align: top;
	display: inline-block;
	height: 290px;
}
.col3 li.flow {
	background: #ffffff;
	position: relative;
	border: 3px solid #808080;
	border-radius: 20px;
}
.col3 img.arrow {
 position: absolute;
  top: 40%;
  right: -27px;
  z-index: 10;
}
.col3 li img{
    margin:-18px 0 25px 0;
}

/* ============== MV =================== */
.mv{
	position: relative;
}
.mv img{
	margin: auto;
}
.mv-ttl{
	position: relative;
	background:#1da1f2;
	margin: auto;
	height:66px;
}
.mv-ttl img{
	max-width: 764px;
    position: absolute;
    top: 50%;
    left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
.mv_btn-area {
	width:90%;
    margin:0 auto;
}
.mv_btn-area a .e-btn:hover{
	opacity: 0;
	transition-duration: 0.2s;
	
}
.mv_btn-area .h-btn{
	position: absolute;
	bottom: 34.5%;
	z-index:-1;
}


/* =============コンテンツbox===============*/

.sec-box:nth-child(2) {
	padding: 25px 0 30px;
}

/* ================= 注釈 ================= */
.att-box{
text-align: left;
}

.att-boxin {
    width: 94%;
    max-width: 850px;
    box-sizing: border-box;
    margin: 25px auto 0;
    background-color: #fff;
    border-radius: 15px;
    padding: 25px 4% 30px;
}

.tt-2 {
  margin: 15px 7px 10px 7px;
	font-size: 150%;
  font-weight: 600;
  color: #1da1f2;
	line-height: 1;
    padding:2px 20px;
    background: url(https://pntc.sslcs.cdngc.net/cdn/cmn/img/sb_btn_gry.png) no-repeat 0 50%;
}
.tt-2:first-child {
	margin-top: 0;
}
.list-ind {
	display: block;
	padding-left: 1em;
	text-indent: -1em;
	margin: 0px;
}
.list-notes {
	padding-left: 1em;
	text-indent: -1em;
}

/* =================ボタン(タブ内)================== */
.btn {
	max-width:670px;
	width:100%;
	margin:17px auto 0;
}
.btn img{
	margin: auto;
}
.btn a {
	width:100%;
}
.btn:hover {
  transition-duration: 0.2s;
	opacity: 0.8;
	transform: translateY(1px);
}


/* ================= その他 ====================== */
.clearfix:after {
  content: ""; 
  display: block; 
  clear: both;
}

.container-wrap #pagetop{
	padding-top: 50px;
}

.fl-l {
	float: left;
}

.fl-r {
	float: right;
}
.mT10 {
	margin-top: 10px;
}
.mT20 {
	margin-top: 20px;
}

.mT25 {
	margin-top: 25px;
}

.mT30 {
	margin-top: 30px;
}

.mB10 {
	margin-bottom: 10px;
}
.mB20 {
	margin-bottom: 20px;
}

.mB25 {
	margin-bottom: 25px;
}

.mB30 {
	margin-bottom: 30px;
}
.stxt{
    font-size:87%;
}

/* ============== タブレット調整用=============== */
@media only screen and (max-width:1024px) {

.box01{
    height: 450px;}
}

/* ============== タブレット調整用=============== */
@media only screen and (max-width:850px) {

.box01{
    height: 380px;}
}



/******************** タブレット調整用 *********************/
@media screen and (max-width:999px) and (min-width: 861px) {
	.img_inner {
		width: 100%;
	}

	ul.col3 li {
		height: 275px;
	}

}

/******************** 調整用 *********************/
@media screen and (max-width:860px) and (min-width: 768px) {
	.img_inner {
	width: 100%;
	}

    ul.col3 li {
		height: 230px;
	}

	.tw_btn {
		width: 95%;
	}

}

/* ================= SP ====================== */

@media screen and (max-width: 767px) {
	.display-pc {
		display: none;
	}
	.display-sp {
		display: block;
	}
	#contents {
		font-size: 1.3rem;
		line-height: 1.6;
	}
	.sec-box {
		width: 95%;
		margin:0 auto;
	}
    .box01{
    width: 95%;
    height: auto;
    margin:10px 0 5px;
}
    .boxin{
    position: relative;
    margin: -90px 0 20px 0;
}
    .sec-btn img{
    position: relative;
    margin:-10px 0 0 0 ;
}
/* ========== MV ============= */
	.mv {
		margin-bottom: 2%;
	}
	.mv-ttl{
		margin: auto;
		height:13vw;
	}
    .mv-ttl img{
	width: 75%;
}
	.mv_btn-area .entry-att {
		font-size: 3.5vw;
	}
	
/* =======コンテンツ==========*/
	.sec-box:nth-child(2) {
		padding: 6% 0 1%;
	}



/* ============= 注釈 ============ */

	.container-wrap #pagetop{
		padding-top: 6%;
	}
    .btn-att {
    text-align: left;
}
	
	/* =================ボタン(タブ内)================== */
	.btn {
		margin:0 auto ;
	}
    .btn2 {
		margin:5% auto 0;
	}
    
    /* =================SNS================== */
.sec-boxsns .sns{
    padding: 0 5px;
}
}
@media screen and (max-width: 412px) {

/* ========= タブ関連 ========== */
    ul.tab li.tab-fst a,ul.tab li.tab-scd a {
    color: #fff;
    font-size:75%;
    padding:5px 0 ;
}
}