@charset "UTF-8";


/*=============================================
初期設定
iPhone SE　の　Portrait　横幅 320px
=============================================*/

section#transaction_2{
display: none;
}


h4.step{
color: #fff;
font-size: 13px;
font-weight: 600;
border-radius: 30px;
background-color: #003366;
text-align: center;
padding: 8px 0px;
margin: 0px auto;
width: 35%;

position: absolute;
top:54px;
right: 0;
left: 0;
margin: 0 auto;
}


div#step{
margin: 0px 0px 0px;
}


div.about_3{
margin: 70px 0px 0px;
padding: 34px 0px 0px;
background-color: #ebf4ff;
border-radius: 10px;
width: 90vw;
}




h4.step2 {
    font-size: 1.5rem;
    font-weight: 600;
    text-align: center;
    color: #003366;
    padding: 10px 0px;
    margin: 0px auto;
    width: 85%;
	background-color: #fff;
}




section#transaction div.scd_2 div#title2 p.products {
    font-size: 1.4rem;
    line-height: 1.75;
    color: #666;
    text-align: left;
    padding: 40px 0px 0px;
    margin: 0px auto;
    width: 85%;
}


section#transaction div.scd_2 div#title2 p.products span#torihiki {
    font-size: 1.4rem;
    line-height: 1.75;
    color: #ff0000;
    text-align: left;
    padding: 40px 0px 0px;
    margin: 0px auto;
    width: 85%;
	font-weight: 600;
}





/*step1お問合せ　設定*/
section#transaction div#about_2 div#contact_s {
    margin: 0px auto;
    width: 90%;
    padding: 0px 0px 28px;
}


section#transaction div#about_2 div#contact_s figure#tel_icon {
    width: 28px;
    height: auto;
    margin: 0px;
    padding: 0px;
}


section#transaction div#about_2 div#contact_s figure#tel_icon img {
    width: 28px;
    height: auto;
}

section#transaction div#about_2 div#contact_s p#contact3 {
    font-size: 1.8rem;
    font-weight: 600;
    color: #003366;
	padding: 0px;
}

section#transaction div#about_2 div#contact_s a {
    text-decoration: none;
    width: 100%;
    display: flex;
    justify-content: center;
}





/*関連コンテンツ　背景設定*/
section#aboutp_2{
background-color: #ebf4ff;
padding: 0px 0px 40px 0px;
margin: 0px;
}

div.scd_3 div.scd_4 div.about_2,
div.scd_3 div.scd_5 div.about_2 {
    background-color: #fff;
}


div#title2 h3.transaction_title{
    font-size: 1.8rem;
	font-weight: 600;
    text-align: center;
    color: #003366;
    padding: 0px;
    width: 64%;
    margin: 0px auto;
	border: none;
}




/*サイトマップの設定*/

section#map div#sitemap,
section#map div#sitemap_2,
section#map div#sitemap_3,
section#map div#sitemap_4{
width: 90%;
margin: 0px auto;
}


section#map div#sitemap{
padding: 10px 0px 20px;
}


section#map div#sitemap_2,
section#map div#sitemap_3{
padding: 0px 0px 20px;
}


section#map div#sitemap_4{
padding: 0px 0px 50px;
}




section#map div#sitemap h3.sitemap_title,
section#map div#sitemap_2 h3.sitemap_title,
section#map div#sitemap_3 h3.sitemap_title{
font-size: 1.6rem;
color: #003366;
padding: 10px 0px;
font-weight: 700;
}

section#map div#sitemap p.sitemap_p,
section#map div#sitemap_2 p.sitemap_p,
section#map div#sitemap_3 p.sitemap_p,
section#map div#sitemap_4 p.sitemap_p{
font-size: 1.4rem;
color: #666;
line-height: 1.75;
padding: 10px 0px;
}



div#sitemap2{
display: flex;
justify-content: flex-start;
border-bottom: 1px solid #ccc;
}

div#sitemap2 figure.yajirushi{
width: 8px;
height: auto;
padding: 15px 10px 5px 10px;
}



/*=============================================
一般的なAndroid　の　Portrait　横幅 360px
=============================================*/
@media screen and (min-width:360px){

}


/*=============================================
iPhone 8,7,6　の　Portrait　横幅 375px
=============================================*/
@media screen and (min-width:375px){

}



/*=============================================
iPhone X　の　Portrait　横幅 375px　高さ 812px
=============================================*/
@media screen and (width:375px) and (height:812px){

}


/*=============================================
iPhone 8plus,7plus,6plus　の　Portrait　横幅 414px
=============================================*/
@media screen and (min-width:414px){

}



/*=============================================
iPhone SE　の　Landscape　横幅 568px
=============================================*/
@media screen and (min-width:568px){

/*関連コンテンツ　背景設定*/
section#aboutp_2 {
    padding: 0px 0px 70px 0px;
}


/*取引の流れ　設定*/
div.about_3 {
margin: 0px;
padding: 36px 0px 0px;
width: 245px;
height: 100%;
	
	/*親要素からはみ出すのを防ぐ*/
	-moz-box-sizing: border-box;
    box-sizing: border-box;
}



h4.step {
    position: absolute;
    top: -14px;
    right: 0;
    left: 0;
    margin: 0 auto;
}



section#transaction div.scd_5 {
    margin: 50px auto 0px;
}



/*step1お問合せ　設定*/
section#transaction div#about_2 div#contact_s figure#tel_icon {
    width: 24px;
    height: auto;
}

section#transaction div#about_2 div#contact_s figure#tel_icon img {
    width: 24px;
    height: auto;
}

section#transaction div#about_2 div#contact_s p#contact3 {
    font-size: 1.6rem;
    font-weight: 600;
    color: #003366;
    padding: 0px;
}

section#transaction div.scd_4 {
	margin: 20px auto 0px;
}

section#transaction div.scd_2 div#title2 p.products {
text-align: center;
}
 


}







/*=============================================
一般的なAndroid　の　Landscape　横幅 640px
=============================================*/
@media screen and (min-width:640px){

}




/*=============================================
iPhone 8,7,6　の　Landscape　横幅 667px
=============================================*/
@media screen and (min-width:667px){


/* ★背景　設定 */
section#transaction div.scd_3{
width: 566px;
margin: 30px auto 0px;
}

section#transaction div.scd_4{
width: 100%;
height: 270px;
}


section#transaction div.scd_5{
width: 100%;
height: 240px;
}



section#transaction div.scd_3 div.scd_4 div.about_3 {
    width: 270px;
	height: 270px;
}

section#transaction div.scd_3 div.scd_5 div.about_3 {
    width: 270px;
	height: 240px;
}



section#transaction div.scd_5{
margin: 56px auto 0px;
}


section#transaction div.scd_3 div.about_2{
width: 270px;
height: 340px;
}


section#transaction div.scd_3 div.scd_4 div.about_2,
section#transaction div.scd_3 div.scd_5 div.about_2{
background-color: #ff0000;
width: 270px;
height: 340px;
} 


section#transaction div.scd_3 div.scd_4 div#about_2{
height: 200px;
}

section#transaction div.scd_3 div.scd_5 div#about_2{
height: 200px;
}



}






/*=============================================
iPhone 8plus,7plus,6plus　の　Landscape　横幅 736px
=============================================*/
@media screen and (min-width:736px){


/*取引の流れ　設定*/
div.about_3 {
    width: 280px;
    height: 100%;
}



/*サイトマップの設定*/

section#map div.sitemap_float{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 660px;
/*width: 90%;*/
margin: 0px auto;
padding: 40px 0px 50px 0px;
}


section#map div#sitemap, 
section#map div#sitemap_2, 
section#map div#sitemap_3, 
section#map div#sitemap_4{
width: 310px;
height: auto;
}


section#map div#sitemap_3,
section#map div#sitemap_4{
padding: 30px 0px 0px;
}


section#map div#sitemap{
padding: 0px;
}


}






/*=============================================
iPad　の　Portrait　横幅 768px
=============================================*/
@media screen and (min-width:768px){

/*取引の流れ　設定*/
div.about_3 {
    width: 340px;
    height: 100%;
}

section#aboutp_2 {
    padding: 60px 0px 70px 0px;
}

div#title2 h3.transaction_title {
    font-size: 2.2rem;
}


/* ★背景　設定 */
section#transaction div.scd_3{
width: 708px;
margin: 34px auto 0px;
}


section#transaction div.scd_3 div.scd_4 div.about_3 {
    width: 340px;
	height: 260px;
}

section#transaction div.scd_3 div.scd_5 div.about_3 {
    width: 340px;
	height: 230px;
}



section#transaction div#about_2 div#contact_s figure#tel_icon {
    width: 28px;
    height: auto;
}

section#transaction div#about_2 div#contact_s figure#tel_icon img {
    width: 28px;
    height: auto;
}


section#transaction div#about_2 div#contact_s p#contact3 {
    font-size: 2rem;
}

section#transaction div#about_2 div#contact_s {
    padding: 10px 0px 32px;
}


/*サイトマップの設定*/

section#map div.sitemap_float{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 650px;
/*width: 85%;*/
padding: 30px 0px 80px 0px;
}



}


/*=============================================
iPhone X　の　Landscape　横幅 812px　高さ 375px
=============================================*/
@media screen and (width:812px) and (height:375px){


div.about_3 {
    padding: 40px 0px 0px;
}


/*サイトマップの設定*/
section#map div.sitemap_float{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
/*width: 82%;*/
}



}



/*=============================================
iPad Pro 10.5インチ　の　Portrait　横幅 834px
=============================================*/
@media screen and (min-width:834px){

}





/*=============================================
iPad　の　Landscape　横幅 1024px
=============================================*/
@media screen and (min-width:1024px){

section#transaction_2{
display: block;
}

section#transaction{
display: none;
}



/*関連コンテンツ　設定*/
section#aboutp_3 {
    background-color: #ebf4ff;
    padding: 60px 0px 100px 0px;
    margin: 0px;
}


section#aboutp_3 div.scd_3 {
    width: 956px;
    margin: 40px auto 0px;
}



/*背景　設定*/
section#transaction_2 div.scd_3 {
    width: 956px;
    margin: 90px auto 0px;
}


section#transaction_2 div.scd_2 div.scd_4 div.about_3 {
    width: 300px;
    height: 260px;
}


section#transaction_2 div.scd_2 div.scd_5 div.about_3 {
    width: 300px;
    height: 200px;
}




div.about_3_2 {
    width: 300px;
    height: 100%;
	opacity: 0;
}


section#transaction_2 div.scd_2 div.scd_4,
section#transaction_2 div.scd_2 div.scd_5{
    width: 100%;
    height: 260px;
}


section#transaction_2 div.scd_2 div.scd_5{
    width: 100%;
    height: 200px;
}




section#transaction_2 div.scd_2 div.scd_4 div#about_2 {
    height: 280px;
}

section#transaction_2 div.scd_2 div.scd_5 div#about_2 {
    height: 160px;
}


section#transaction_2 div.scd_2 div#title2 p.products {
    text-align: center;
    font-size: 1.6rem;
    line-height: 2;
    padding: 60px 0px 0px;
    color: #666;
    margin: 0px auto;
    width: 90%;
}


section#transaction_2 div.scd_2 div#title2 p.products span#torihiki {
    text-align: center;
    font-size: 1.6rem;
    line-height: 2;
    padding: 60px 0px 0px;
    color: #ff0000;
    margin: 0px auto;
    width: 90%;
	font-weight: 600;
}




/*step1お問合せ　設定*/
section#transaction_2 div#about_2 div#contact_s {
    margin: 0px auto;
    width: 90%;
    padding: 10px 0px 28px;
	/*background-color: aqua;*/
}


section#transaction_2 div#about_2 div#contact_s figure#tel_icon {
    width: 28px;
    height: auto;
    margin: 0px;
    padding: 0px;
}


section#transaction_2 div#about_2 div#contact_s figure#tel_icon img {
    width: 28px;
    height: auto;
}

section#transaction_2 div#about_2 div#contact_s p#contact3 {
    font-size: 1.8rem;
    font-weight: 600;
    color: #003366;
	padding: 0px;
}

section#transaction_2 div#about_2 div#contact_s a {
    text-decoration: none;
    width: 100%;
    display: flex;
    justify-content: center;
}





/*サイトマップの設定*/
section#map div.sitemap_float{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
/*width: 92%;*/
width: 940px;
padding: 50px 0px 80px 0px;
}

section#map div#sitemap, 
section#map div#sitemap_2, 
section#map div#sitemap_3, 
section#map div#sitemap_4{
width: 280px;
height: auto;
}


section#map div#sitemap {
    padding: 0px 0px 20px;
}

section#map div#sitemap_3{
    padding: 0px;
}


section#map div#sitemap p.sitemap_p:hover, 
section#map div#sitemap_2 p.sitemap_p:hover, 
section#map div#sitemap_3 p.sitemap_p:hover, 
section#map div#sitemap_4 p.sitemap_p:hover,
section#map div#sitemap h3.sitemap_title:hover, 
section#map div#sitemap_2 h3.sitemap_title:hover, 
section#map div#sitemap_3 h3.sitemap_title:hover {
color: #ebf4ff;
}


section#map div.sitemap_float::after{
    content: "";
    display: block;
    width: 280px;
    height: auto;
}



section#map div#sitemap_4 {
    padding: 0px 0px 0px;
}




}


/*=============================================
iPad Pro　の　Portrait　横幅 1024px 高さ 1366px
=============================================*/
@media screen and (width:1024px) and (height:1366px){

}



/*=============================================
iPad Pro 10.5インチ　の　Landscape　横幅 1112px
=============================================*/
@media screen and (min-width:1112px){

}



/*=============================================
iPad Pro 12.9インチ　の　Landscape　横幅 1366px 高さ 1024px
=============================================*/
@media screen and (width:1366px) and (height:1024px){


/*背景設定*/
section#transaction_2 div.scd_2 div.scd_4 div.about_3 {
    width: 400px;
}

section#transaction_2 div.scd_2 div.scd_5 div.about_3 {
    width: 400px;
    height: 220px;
}


section#transaction_2 div.scd_2 div.scd_4 div#about_2 {
    height: 240px;
}

section#transaction_2 div.scd_2 div.scd_4 div.about_3 {
    width: 400px;
}


section#aboutp_3 div.scd_3 {
width: 1076px;
margin: 40px auto 0px;
}


section#aboutp_3 {
    padding: 60px 0px 90px 0px;
}


div.about_3,
div.about_3_2{
    width: 340px;
    height: 100%;
}



section#transaction_2 div#title2 figure#logom2 {
    padding: 60px 0px 0px;
}


section#transaction_2 div#title2 figure#logom2 img {
    height: 26px;
    width: auto;
    padding: 80px 0px 20px 0px;
}

section#transaction_2 div#title2 h3 {
    width: 18%;
}




/*サイトマップ設定*/
section#map div.sitemap_float {
width: 1280px;
}

section#map div#sitemap_4 {
    padding: 0px;
}



/*サイトマップの設定*/
section#map div.sitemap_float{
padding: 50px 0px 120px 0px;
}


}



/*=============================================
PC 1366ox 以上
=============================================*/
@media screen and (min-width:1366px){

/*背景設定*/
section#transaction_2 div.scd_2 div.scd_4 div.about_3 {
    width: 400px;
}

section#transaction_2 div.scd_2 div.scd_5 div.about_3 {
    width: 400px;
    height: 220px;
}



section#transaction_2 div.scd_2 div.scd_4 div#about_2 {
    height: 240px;
}

section#transaction_2 div.scd_2 div.scd_4 div.about_3 {
    width: 400px;
}



section#aboutp_3 div.scd_3 {
width: 1280px;
margin: 40px auto 0px;
}


section#transaction_2 div.scd_3{
width: 1280px;
}


div.about_3,
div.about_3_2{
    width: 400px;
    height: 100%;
}


section#transaction_2 div#title2 figure#logom2 {
    padding: 60px 0px 0px;
}


section#transaction_2 div#title2 figure#logom2 img {
    height: 26px;
    width: auto;
    padding: 80px 0px 20px 0px;
}


section#transaction_2 div#title2 h3 {
    width: 18%;
}





/*サイトマップ設定*/
section#map div.sitemap_float {
width: 1280px;
}


section#map div#sitemap_4 {
    padding: 0px;
}


}



/*=============================================
プリントアウト
=============================================*/
@media print{

}