/*/*/.lower#howtoorder h2 {
background: url(/images/howtoorder/ttl_bg_howto.jpg) no-repeat 50% 50%;
background-size: cover;
}
#howtoorder .sec_inner {
width:960px;
margin:0 auto;
}
@media screen and (max-width:1080px){
#howtoorder .sec_inner {
width:100%;
padding:5%;
box-sizing:border-box;
}
}/*/*/#howtoorder #flow {
border-bottom:1px solid #e5e5e5;
margin-bottom:120px;
}
#howtoorder #flow p{
text-align:center;
line-height:1.8em;
margin-bottom:60px;
}
#howtoorder #flow ul li {
width:100%;
display:block;
padding:40px 0;
border-top:1px dashed #e5e5e5;
border-bottom:1px dashed #e5e5e5;
}
#howtoorder #flow ul li:last-child {
margin-bottom:60px;
}
#howtoorder #flow .left-box {
width:320px;
text-align:center;
}
#howtoorder #flow .left-box .icon{
display:block;
margin-bottom:25px;
}
#howtoorder #flow .left-box dl dd {
display:block;
font-size:14px;
}
#howtoorder #flow .right-box {
width:500px;
margin-right:70px;
}
#howtoorder #flow .right-box dt {
display:block;
margin-bottom:30px;
}
#howtoorder #flow .right-box dt .crim{
font-size:16px;
font-style:italic;
border:1px solid #000;
padding:2px 14px;
box-sizing:border-box;
margin-right:20px;
}
#howtoorder #flow .right-box dt .jp{
font-size:18px;
font-weight:bold;
vertical-align: middle;
}
#howtoorder #flow .right-box dd{
font-size:12px;
line-height:2em;
}
#howtoorder #flow .right-box dd a {
display:inline-block;
text-decoration:underline;
}
#howtoorder #flow .left-box .icon-flow1 {
font-size:64px;
margin-top:20px;
}
#howtoorder #flow .left-box .icon-flow2 {
font-size:64px;
margin-top:20px;
}
#howtoorder #flow .left-box .icon-flow3 {
font-size:64px;
margin-top:20px;
}
#howtoorder #flow .left-box .icon-flow4 {
font-size:65px;
margin-top:20px;
}
#howtoorder #flow .left-box .icon-flow5{
font-size:70px;
margin-top:25px;
}
#howtoorder #flow .left-box .icon-flow6 {
font-size:60px;
margin-top:10px;
}
#howtoorder #flow .term {
font-size: 11px;
margin: 15px 0 20px;
display: inline-block;
background: #f0f0f0;
padding: 8px 16px;
}
#howtoorder #flow .proposal ol {
width: 100%;
font-size:0;/**/}
#howtoorder #flow .proposal ol li {
display: inline-block;
width: 21%;
margin-right: 2%;
border: 0;
padding: 0;
}
#howtoorder #flow .proposal ol li:last-child {
margin-right: 0;
margin-bottom: 0;
}
#howtoorder #flow .proposal ol li img{
width: 100%;
}
@media screen and (max-width:1080px){
#howtoorder #flow {
margin-bottom:60px;
}
#howtoorder #flow p {
line-height:1.5em;
margin-bottom:30px;
}
#howtoorder #flow .left-box {
width:100%;
}
#howtoorder #flow .left-box .icon {
margin-bottom:40px;
}
#howtoorder #flow .right-box {
width:100%;
}
#howtoorder #flow .left-box dl dd {
display:none;
}
#howtoorder #flow .right-box dt {
margin-bottom:15px;
}
#howtoorder #flow .right-box dt .jp {
padding-top:2px;
}
#howtoorder #flow .right-box dd {
text-align:justify;
line-height:1.5em;
}
}
#howtoorder .note {
font-size: 11px;
display: block;
color: #999;
line-height: 1.5em;
}/*/*/#howtoorder #kinds {
border-bottom:1px solid #e5e5e5;
margin-bottom:120px;
}
#howtoorder #kinds p{
text-align:center;
line-height:1.8em;
margin-bottom:60px;
}
#howtoorder #kinds ul li {
width:100%;
display:block;
padding:40px 0;
border-bottom:1px dashed #e5e5e5;
}
#howtoorder #kinds ul li:first-child {
padding-top:0;
}
#howtoorder #kinds ul li:last-child {
margin-bottom:60px;
}
#howtoorder #kinds .left-box {
width:400px;
}
#howtoorder #kinds .left-box .ph img{
width:100%;
}
#howtoorder #kinds .right-box {
width:500px;
}
#howtoorder #kinds .right-box dt{
font-size:16px;
display:block;
margin-bottom:15px;
font-weight:bold;
}
#howtoorder #kinds .right-box dd{
font-size:12px;
line-height:1.8em;
margin-bottom:30px;
}
#howtoorder #kinds .right-box dd.table {
margin-bottom:0;
line-height:1em;
}
#howtoorder #kinds .right-box dd table{
width:100%;
border:1px solid #e5e5e5;
}
#howtoorder #kinds .right-box dd table th{
text-align:center;
padding:15px 0;
background:#f9f9f9;
border-right:1px solid #e5e5e5;
border-bottom:1px solid #e5e5e5;
width:40%;
}
#howtoorder #kinds .right-box dd table td{
text-align:center;
padding:15px 0;
border-bottom:1px solid #e5e5e5;
}
#howtoorder #kinds .note{
font-size:10px;
color:#999;
margin-top: 15px;
display: block;
}
@media screen and (max-width:1080px){
#howtoorder #kinds {
margin-bottom:60px;
}
#howtoorder #kinds p {
text-align:justify;
line-height:1.5em;
margin-bottom:40px;
}
#howtoorder #kinds .left-box {
width:100%;
margin-bottom: 20px;
}
#howtoorder #kinds .right-box dt {
margin-bottom:10px;
}
#howtoorder #kinds .right-box dd {
text-align:justify;
line-height:1.5em;
}
#howtoorder #kinds .left-box .ph img{
width:100%;
}
#howtoorder #kinds .right-box {
width:100%;
}
}
#howtoorder #faq {
}
#howtoorder #faq p {
text-align:center;
line-height:2em;
margin-bottom:60px;
}
#howtoorder #faq p a{
display:inline-block;
text-decoration:underline;
}
#howtoorder .faq-conts dl{
width:100%;
}
#howtoorder .faq-conts dl:last-child{
margin-bottom:60px;
}
#howtoorder .faq-conts .que {
position:relative;
border-bottom:1px dashed #e5e5e5;
margin-bottom:20px;
padding:0 10px 20px 10px;
vertical-align:middle;
cursor:pointer;
}
#howtoorder .faq-conts .que .crim {
display:inline-block;
font-size:20px;
color:#000;
width:50px;
}
#howtoorder .faq-conts .que .jp{
display:inline-block;
font-size:14px;
font-family: "YuGothic", "游ゴシック","ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN","メイリオ",Meiryo, serif;
vertical-align: middle;
}
#howtoorder .faq-conts .icon-down:before {
color:#999;
font-size:10px;
position: absolute;
right: 1%;
top: 50%;
margin-top: -1em;
-webkit-transition: .3s;
transition: .3s;
}
#howtoorder .faq-conts .active:before {
-moz-transform: translate(50%, 0);
-ms-transform: translate(50%, 0);
-webkit-transform: translate(50%, 0);
transform: translate(50%, 0);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
#howtoorder .faq-conts .ans {
display:none;
padding:20px;
font-size:12px;
background:#f9f9f9;
margin-bottom:40px;
}
#howtoorder .faq-conts .ans .crim{
float:left;
color:#d02626;
font-size:20px;
width:5%;
}
#howtoorder .faq-conts .ans .jp{
float:left;
text-align:justify;
width:95%;
line-height:2em;
}
@media screen and (max-width:1080px){
#howtoorder #faq p {
line-height:1.5em;
}
#howtoorder .faq-conts .que .jp {
font-size:13px;
width:75%;
}
#howtoorder .faq-conts .ans .crim{
width:9%;
}
#howtoorder .faq-conts .ans {
padding:5%;
}
#howtoorder .faq-conts .ans .jp{
float: right;
width: 90%;
line-height:1.5em;
}
}