@charset "utf-8";
/* CSS Document */


@media screen and (max-width:798px) and (min-width:580px) {	
	.lora {}
	.join img {width: 100%;}

.lora-font {
	width: 80%;display:block;
}
.map-img1 img {
    width: 100%;
}
.map-img2 img {
    width: 90%;
	min-width: auto;}
.program-right {
	width: 45%;}	
.program-left {
	width: 50%;}	
.title-bar {
    font-size: 2.4rem;
    left: calc(12% - 59px);
	}
	
.gift-right {
	left: 53%;}

.btn1 {
    padding: 20px 40px;
	max-width: 200px;
}
.btn2 {
    padding: 20px 40px;
	max-width: 200px;
}
.featuresContent {
		padding: 15px 10px 15px 10px;}
	.taffic {
    margin: 0px auto;
    padding: 20px 0;
	}
	.map-prouct-mb {margin-top: 100px;
	display: block;background-image: url("../images/prouct-bg.png");background-size: cover;background-position: center;}
.map-prouct-pc {
	display: none;}
	body{background-color: #f8f8f8;max-width: 1200px;margin: auto;}
	.mi-ma-tit-two {letter-spacing: 0.1rem;}
	.smalltext {
		width: 80%;}
	.lora-right {
    display: block;
		width: 80%;
    margin:0 auto;}
	.lora-font {
		margin:0 auto;}
}
@media  screen and (max-width:580px) {

	.mi-why{
		    padding-top: 10%;
		    padding-bottom: 10%;
	}

	.lora {

	}

	.mi-ma-tit-two {letter-spacing: 0.1rem;}
	.kv{
	background-size:auto;
		width: 100%;
		padding-bottom: 15%;
		height: 350px;
	}
	.lora{

	background-size:contain;
		width: 100%;height: auto;
	padding-top: 0%;
	    padding-top: 10%;
}
	
	.mi-ma-tit-zero {
		font-size: 2.5rem;}

	.lora-font {
    font-size: 1.2rem;
    width: auto;
    vertical-align: middle;
    display: block;
    
    height: auto;
    position: relative;
    top: auto;
    left: auto;
    line-height: 32px;
    padding: 30px 20px;

    /*padding-bottom: 0px;*/


}
	.kv-font {
    padding-top: 13%;
}
	.text-l {
    text-align: center;
    font-size: 1rem;
        font-size: 0.9rem;
            text-align: left;
            /*margin-bottom: 10%;*/
                padding-bottom: 5%;
                padding-left: 5%;
}
.lora-right {
    display: block;
    width: 70%;
   margin: auto;
    background-position: center;
    background-size: cover;
}	

.lora-mb-right {
	padding-bottom: 10%;
}

	.smalltext {
		width: 80%;}
	.title-bar {
    font-size: 1.6rem;
    font-weight: bold;
    display: block;
    position: relative;
    left: auto;
    margin: 20px 10px;
        margin-top: 0px;
            margin-bottom: 0px;
                margin-bottom: 8%;
}
	.join-pc-img {
		width: 100%;
}
	.join-mb-img {
	display: block;
	    width: 90%;
    margin: auto;
}
	.join img {
		width: 60%;
	}
	.map-img1 img {
		width: 95%;}
	.btn1 {
    padding: 20px 40px;
	max-width: 200px;
		display: block;
		margin: 0 auto 50px auto;
}
	.gift-bg {
    /*padding: 40px 0px 0px 0px;*/
		background-size: cover;}
.btn2 {
    padding: 20px 40px;
	max-width: 200px;
		display: block;
		margin: 0 auto;
	
}
	.map-prouct-mb img{margin: 30px auto 0 auto;
		width: 100%;
	display: block;}
	.map-prouct-mb {margin-top: 30px;
	display: block;    margin-bottom: 30px;
		background-image: url("../images/prouct-bg.png");background-size: cover;background-position: center;}
.map-prouct-pc {
	display: none;}
	.program-left {
    width: 100%;
		display: block; margin: 50px 0;}
	.program-right {
    width: 100%;
    display: block;
    text-align: left;
    margin: 50px 0;
        margin-top: 0px;
}
	.program-left ul {
    font-size: 1rem;
    line-height: 2rem;
}
.email-left {
    display: block;
    vertical-align: bottom;
	margin: 20px;	
    margin-top: 0;}
	
	.email-left img{width: 50px;}
	
.program {
   padding-top: 10px;
    padding-bottom: 2px	
	}
.program-pc-img {
	display:none;
}
.program-mb-img {
	display: block;
}
	
.program-mb-img img {width: 100%;/*margin: 15px 0;*/}
.gift-left {
    text-align: center;
    width: 90%;
    position: relative;
	left: auto;
	padding-left: 0px;
	margin: 0 auto;}
	.mid-tit {
    /*font-size: 1.8rem;*/
   
		line-height: 33px;}
.sub {
	/*font-size: 2.0rem;*/
	font-size: 1.5rem;
	    margin-bottom: 7%;
	    text-align: center;
}	

	
.gift-right {
	position: unset;
	    margin-top: -15%;
}	
	
.featuresContent {
	padding: 15px 0px 15px 0px;}	
	
.taffic {
    margin: 0px auto;
    padding: 0;
	padding-top: 15px;}	
.smalltext {
	font-size: 1.2rem;    padding: 10px;}	

#imart-container p {
	line-height: 1.3em !important;}	

	.title-bar-mb {
		    font-size: 1.5rem;
		        margin-top: 5%;
		            width: 90%;
    margin: auto;
    margin-bottom: 5%;
    margin-top: 5%;
	}

	
    .mi-class-tc{
    	    font-size: 0.9rem;
    }



	.mi-mb-nomb{
		    margin-bottom: 0px;
	}


		.mi-pc-only{
		    display: none;
	}

	.mi-mb-only{
		    display: block;
	}
	
}