@charset "utf-8";

@media screen and (max-width: 750px) {
	body {
		position: relative;
	}
	body:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(220,220,220, 0.7);
		opacity: 0;
		z-index: -1;
	}
	body.overlay:before {
		opacity: 1;
		z-index: 1;
	}
	.pc {
		display: none !important;
	}
	.inner {
		max-width: 375px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 15px;
		padding-right: 15px;
	}

	button {
		padding: 0;
		border: 0;
		background-color: transparent;
	}

	body {
		min-width: inherit;
    	overflow-x: hidden;
	}
	#wrapper {
		min-width: 100%;
	}
	.note {
		color: #c70d0d;
		font-size: 10px;
		margin-top: 10px;
	}

	/* header + * {
		padding-top: 122px;
	} */
	
	/* #mv
	---------------------------------------- */
	#mv .inner {
		max-width: none;
		padding-left: 0;
		padding-right: 0;
	}
	#mv img {
		width: 100%;
	}

	
	/* #description
	---------------------------------------- */
	#description img {
		margin: 0 auto;
	}
	#description .image {
		margin-top: 18px;
		margin-bottom: 25px;
	}
	#description .text {
		color: #222;
		font-size: 14px;
		font-weight: bold;
		text-align: center;
		margin-bottom: 45px;
		line-height: 1.4;
	}
	#description .text span {
		font-size: 18px;
		display: block;
	}
	#description .text p {
		max-width: 363px;
		margin: 0 auto;
		padding-top: 15px;
		padding-bottom: 15px;
		border-top: 2px solid #284899;
		border-bottom: 2px solid #284899;
	}
	#description .endTxt {
		margin-bottom: 45px;
		padding: 16px;
		background: #c70d0d;
    	color: #fff;
    	font-size: 14px;
    	text-align: center;
	}

	/* #video
	---------------------------------------------- */
	#video {
		padding-top: 58px;
		padding-bottom: 60px;
	}
	#video h2 {
		margin-bottom: 33px;
	}
	#video h2 img {
		margin: 0 auto;
	}
	.giftList .listContent{
		padding-left: 15px;
		padding-right: 15px;
	}
	
	.giftList .row {
		
		background-color: #fff;
		max-width: 625px;
		margin: 0 auto;
		position: relative;
		z-index: 2;
	}
	.giftList .imageTag {
		position: absolute;
		width: 90px;
		height: 90px;
		left: 0;
		top: 0;
		z-index: -1;
	}
	.giftList .row + .row {
		margin-top: 28px;
	}
	/* .giftList .image {
		background-image: url(../img/sp/img_tag_01.png);
		background-size: 29%;
		background-repeat: no-repeat;
		background-position: top left;
	} */
	/* .giftList .row:nth-child(2) .image {
		background-image: url(../img/sp/img_tag_02.png);
	}
	.giftList .row:last-child .image {
		background-image: url(../img/sp/img_tag_03.png);
	} */
	.giftList .groupContent {
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 28px;
	}
	.giftList .groupContent h3 {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.giftList .groupContent .text {
		color: #222;
		line-height: 1.4;
		font-size: 14px;
	}
	.giftList .groupContent .text p span {
		display: block;
		padding-left: 8px;
	}
	.giftList .groupContent img {
		margin: 0 auto;
	}
	#video .note {
		font-size: 10px;
		color: #444;
		text-align: left;
		margin-top: 8px;
		margin-bottom: 60px;
		padding-left: 15px;
		padding-right: 15px;
	}
	#video .note p {
		max-width: 625px;
		margin: 0 auto;
	}




	.steps {
		background-color: #fff;
	}
	.steps h3 {
		text-align: center;
		font-size: 23px;
		font-weight: bold;
		color: #fff;
		-webkit-transform: translateY(-50%);
		    -ms-transform: translateY(-50%);
		        transform: translateY(-50%);
		margin-bottom: 25px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.steps h3 span {
		display: block;
		padding: 13px 10px;
		background-color: #284899;
	}
	.stepList .listContent .row img {
		margin-left: auto;
		margin-right: auto;
	}
	.stepList .listContent .row {
		padding-left: 15px;
		padding-right: 15px;
		text-align: center;
	}
	.stepList .listContent .row .anchor {
		display: inline-block;
		margin: 10px 0 5px;
		border-bottom: solid 1px #000;
		color: #000;
	}
	.stepList .listFooter {
		margin-top: 39px;
		margin-bottom: 35px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.stepList .text {
		color: #444;
		padding: 48px 15px 15px;
		background-color: #ededed;
		position: relative;
		font-size: 12px;
		text-align: center;
		line-height: 1.5;
	}
	.stepList .listFooter .text:first-child {
		padding-left: 4px;
		padding-right: 4px;
	}
	.stepList #follow {
		margin-top: -65px;
		padding-top: 65px;
	}
	.stepList .text + .text {
		margin-top: 10px;
	}
	.stepList .text:before {
		content: '';
		position: absolute;
		left: 50%;
		top: 11px;
		-webkit-transform: translateX(-50%);
		    -ms-transform: translateX(-50%);
		        transform: translateX(-50%);
		width: 25px;
		height: 23px;
		background-image: url(../img/sp/img_warning.png);
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
	}
	.stepList .btn {
		text-align: center;
		padding-left: 15px;
		padding-right: 15px;
		
	}
	.stepList .btn a {
		display: inline-block;
		margin-bottom: 35px;
	}

	/* #movie
	--------------------------------------- */
	#movie {
		padding-top: 58px;
		padding-bottom: 40px;
	}
	#movie h2 {
		margin-bottom: 30px;
	}
	#movie h2 img {
		margin: 0 auto;
	}
	.listMovie {
		max-width: 670px;
		margin: 0 auto;
	}
	.listMovie .listContent {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		margin-left: 0;
		margin-right: 0;
		-ms-flex-wrap: wrap;
		    flex-wrap: wrap;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
	}


	.listMovie .row {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 100%;
		        flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
		margin-left: 0;
		margin-right: 0;
		margin-bottom: 22px;
	}
	.listMovie .row h3 {
		font-size: 15px;
		font-weight: bold;
		text-align: center;
		padding: 8px 3px;
		color: #fff;
		border: 2px solid #fff;
		margin-bottom: 10px;
	}
	.listMovie .row video {
		display: block;
		height: auto;
		max-width: 100%;
	}
	.listMovie .groupContent {
		padding: 13px 8px 10px;
		background-color: #fff;
		color: #222;
		font-size: 11px;
	}
	.listMovie .groupContent .btn img {
		margin: 0 auto;
		width: 200px;
	}
	.listMovie .groupContent .text {
		margin-bottom: 13px;
	}
	.listMovie .groupContent .large {
		font-size: 16px;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.listMovie .groupContent .endTxt {
		padding: 16px 0;
		border-radius: 10px;
		background: #c70d0d;
    	color: #fff;
    	font-size: 16px;
    	text-align: center;
	}
	.listMovie .textArea {
		color: #fff;
		display: table;
		margin-left: auto;
		margin-right: auto;
		border:2px solid #fff;
		padding: 10px;
		font-size: 11px;
	}
	.listMovie .textArea p.bold {
		font-size: 14px;
		font-weight: bold;
		display: table;
		margin-left: auto;
		margin-right: auto;
	}
	/* #campaign
	------------------------------------------------------ */
	#campaign {
		padding-top: 55px;
		padding-bottom: 60px;
		/* margin-bottom: 25px; */
	}
	#campaign h2 {
		margin-bottom: 28px;
	}
	#campaign h2 img {
		margin: 0 auto;
	}
	.textBox {
		/* max-width: 95.3%;
		margin: 0 auto; */
		background-color: #fff;
		padding:20px 20px;
		height: 250px;
		overflow: hidden;
		position: relative;
		-webkit-transition: height 0.5s ease-in-out;
		-o-transition: height 0.5s ease-in-out;
		transition: height 0.5s ease-in-out;
	}
	.btnOpen button {
		position: relative;
	}
	.btnOpen button:before {
		content: '';
		width: 10px;
		height: 10px;
		position: absolute;
		right: 15px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		    -ms-transform: translateY(-50%);
		        transform: translateY(-50%);
		background-image: url(../img/sp/icon_plus.png);
		background-repeat: no-repeat;
		background-size: contain;
	}
	.textBox.full + .btnOpen button:before {
		background-image: none;
		height: 2px;
		background-color: #fff;
	}

	.textBox:before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		height: 70px;
		bottom: 0;
		background-image: url(../img/sp/bg_overlay.png);
		background-size: contain;
		background-position: bottom;
		opacity: 1;
		-webkit-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		z-index: 2;
	}
	.textBox.full:before {
		/* display: none; */
		opacity: 0;
	}
	.textBox.full {
		height: auto;
	}
	.textBox h3 {
		font-size: 13px;
		font-weight: bold;
		color: #000;
		position: relative;
		padding-left: 14px;
		margin-bottom: 7px;
	} 
	.textBox h3:before {
		content: '';
		position: absolute;
		left: 0;
		bottom: 4px;
		width: 11px;
		height: 11px;
		background-color: #000;

	}
	.textBox .text {
		font-size: 10px;
		color: #000;
	}
	.textBox .text a {
		display: inline-block;
	}
	.textBox .note {
		font-size: 9px;
		color: #666;
		margin-top: 8px;
	}
	.textBox .itemTxt + .itemTxt {
		margin-top: 15px;
	}

	/* #history
	----------------------------------------- */
	#history {
		padding-top: 50px;
		padding-bottom: 30px;
	}
	#history h2 {
		margin-bottom: 50px;
	}
	#history .text {
		color: #222;
		font-size: 14px;
		text-align: center;
		margin-bottom: 45px;
		line-height: 1.4;

	}
	#history .btn {
		position: relative;
		padding-bottom: 50px;
		padding-left: 15px;
		padding-right: 15px;
	}
	#history .btn:before {
		content: '';
		display: block;
		position: absolute;
		left: 15px;
		right: 15px;
		height: 50px;
		bottom: 0;
		background-image: url(../img/sp/btn_boxshadow.png);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: top center;
		;
	}


	/* #special
	------------------------------------------ */
	#special {
		padding-top: 60px;
		padding-bottom: 60px;
	}
	#special h2 {
		margin-bottom: 28px;
	}
	.special .text {
		color: #fff;
		margin-bottom: 33px;
		font-size: 14px;
		text-align: center;
	}
	#special h2 img {
		margin: 0 auto;
	}
	.specialList {
		max-width: 686px;
		margin: 0 auto;
	}
	.specialList .row h3 {
		margin-bottom: 20px;
		padding-left: 15px;
		padding-right: 15px;
	}
	.specialList .row h3 img {
		margin: 0 auto;
	}
	.specialList .row .endTxt {
		margin: 0 15px 56px;
		padding: 16px;
		background: #c70d0d;
    	color: #fff;
    	font-size: 14px;
    	text-align: center;
	}
	.specialList .row .endTxt.contest {
		margin-bottom: 28px;
	}
	.specialList .listContent >.row:nth-child(3) .note {
		padding-left: 15px;
		padding-right: 15px;
	}
	.specialList > .listContent > .row {
		background-color: #fff;
		padding-top: 30px;
		padding-bottom: 28px;
	}
	.specialList > .listContent > .row:first-child {
		margin-bottom: 28px;
	}
	.specialList > .listContent > .row:first-child .item {
		padding-left: 30px;
		padding-right: 30px;
		max-width: 626px;
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}
	.specialList > .listContent > .row:first-child .right {
		-webkit-box-ordinal-group: 0;
		    -ms-flex-order: -1;
		        order: -1;
	}
	.specialList > .listContent > .row:first-child .text {
		font-size: 14px;
		color: #222;
		text-align: left;
		margin-top:20px;
		margin-bottom: 0;
	}
	.specialList > .listContent > .row:first-child p + p {
		margin-top: 25px;
	}
	.specialList .row.new {
		padding: 35px 15px;
	}
	.specialList .row.new .listInfor {
		margin-top: 30px;
	}
	.specialList > .listContent > .row.new .text {
		text-align: center;
	}
	.specialList .row.new .right .image,
	.specialList .row.new .contentRow .image  {
		padding-left: 15px;
		padding-right: 15px;
		
	}
	.specialList > .listContent > .row.new .item {
		display: block;
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 20px;
	}
	.specialList .row.new h4 {
		padding: 10px 0 10px 15px;
		background-color: #284899;
	}
	.specialList .row.new .groupContent {
		padding: 25px 15px 25px 15px;
		background-color: #ededed;
		color: #222;
	}
	.specialList .row.new .textBold {
		font-weight: bold;
		color: #222;
		margin-bottom: 25px;
	}
	.specialList > .listContent > .row.new p + p {
		margin-top: 7px;
	}
	.specialList .row.new .textTime p:not(.not) {
		position: relative;
		padding-left: 12px;
	}
	.specialList .row.new .textTime p:not(.not)::before {
		content: '';
		position: absolute;
		width: 10px;
		height: 10px;
		left: 0;
		top: 5px;
		background-color: #222;
	}
	.specialList > .listContent > .row.new .groupContent .text {
		text-align: left;
		margin-top: 7px;
	}
	.specialList .row.new .textAdd {
		margin-top: 30px;
	}
	.specialList .row.new .textAdd p.bold {
		font-weight: bold;
	}
	.specialList .row.new .textAdd a {
		display: inline-block;
		color: #222;

	}
	.specialList .row.new .contact {
		margin-top: 25px;
		color: #222;
		padding-left: 15px;
		padding-right: 15px;
		margin-bottom: 23px;
	}
	.specialList .row.new .contact p.bold {
		font-weight: bold;
	}
	.specialList .row.new .contact  p:last-child {
		display: none;
	}
	.specialList .row.new .contact  a {
		display: inline-block;
		color: #222;
	}
	.specialList .row.new .videoDemo {
		margin-top: 25px;
	}
	.specialList .row.new .videoDemo iframe {
		width: 100%;
		height: 175px;
	}
	.specialList .row.new .endTxt {
		margin-bottom: 35px;
		font-size: 16px;
	}
	/* 2 */
	.specialList > .listContent > .row:nth-child(2) {
		margin-bottom: 25px;
	}
	.specialList .listContent > .row:nth-child(2) h3 {
		margin-bottom: 28px;
	}
	.specialList .listContent > .row:nth-child(2) .text {
		text-align: center;
		line-height: 1.4;
		margin-bottom: 0;
		color: #222;
		font-size: 14px;
		
	}

	.specialList .listContent > .row:nth-child(2) .text p.blue {
		color: #284899;
		font-size: 14px;
		font-weight: bold;
	}

	.specialList .listContent > .row:nth-child(2) .groupTxt {
		padding-left: 15px;
		padding-right: 15px;
		position: relative;
		margin-bottom: 28px;
	}
	.specialList .listContent > .row:nth-child(2) .groupTxt:before {
		position: absolute;
		content: "";
		left: -5px;
		right: -8px;
		top: -82%;
		height: 151%;
		background-image: url(../img/sp/img_box.png);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
	}
	.specialList .listContent > .row:nth-child(2) .prize .text {
		font-weight: bold;
		margin-bottom: 25px;
	}
	.prize .prizeList img {
		margin-left: auto;
		margin-right: auto;
	}
	.prize {
		margin-left: 15px;
		margin-right: 15px;
		border: 2px solid #284899;
		
	}
	.prize > h4 {
		color: #fff;
		font-size: 20px;
		font-weight: bold;
		background-color: #284899;
		padding: 10px 0;
		text-align: center;
		margin-bottom: 25px;
	}
	.prize .prizeList .listContent {
		padding-left: 15px;
		padding-right: 15px;
	}
	.prizeList .row:first-child {
		padding-bottom: 38px;
		margin-bottom: 38px;
		border-bottom: 1px solid #a4a4a4;
	}
	.prizeList .row h5 {
		font-size: 19px;
		font-weight: bold;
		color: #222;
		text-align: center;
	}
	.prizeList .row h5 + p {
		font-size: 12px;
		color: #222;
		text-align: center;
	}
	.prizeList > .listContent > .row .tag {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.prizeList > .listContent > .row p {
		margin-top: 10px;
	}
	.prizeList  .groupRow .row {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
	.prizeList  .groupRow .left {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 42%;
		        flex: 0 0 42%;
		max-width: 42%;
		width: 42%;
	}
	.prizeList  .groupRow .right {
		-webkit-box-flex: 1;
		    -ms-flex: 1 1 auto;
		        flex: 1 1 auto;
		margin-left: 15px;
	}
	.prizeList  .groupRow .right img {
		margin-left: 0;
	}
	.prizeList  .groupRow h5,
	.prizeList  .groupRow h5 + p {
		text-align: left;
	}
	.prizeList  .groupRow .tag {
		margin-bottom: 30px;
	}
	.prizeList  .groupRow h5 + p {
		margin-top: 13px;
	}
	.prizeList  .groupRow .right {
		padding-top: 13px;
	}
	.prizeList  .groupRow .row:first-child {
		padding-bottom: 43px;
		margin-bottom: 43px;
	}
	.prizeList  .groupRow .row {
		padding-bottom: 40px;
	}
	/* summary */
	
	.summary {
		margin-top: 28px;
		padding: 0 15px 5px;
	}
	.summary h4 {
		font-size: 20px;
		font-weight: bold;
		color: #222;
		text-align: center;
		margin-bottom: 23px;
	}

	.prizeList .note {
		color: #c70d0d;
		font-size: 10px;
		padding-left: 15px;
		padding-right: 15px;
		margin-bottom: 15px;
		margin-top: -10px;
	}
	.summary .note {
		color: #c70d0d;
		font-size: 10px;
		margin-top: -10px;
		margin-bottom: 20px;
	}
	#special .summary .item h5 {
		font-size: 15px;
		color: #000;
		padding-left: 15px;
		position: relative;
		margin-bottom: 8px;
		margin-top: 0;
	}

	#special .summary .item h5:before {
		content: '';
		position: absolute;
		left: 0;
		bottom: 3px;
		width: 10px;
		height: 10px;
		background-color: #000;
	}
	#special .summary .item h5 + p {
		color: #000;
		margin-top: 0;
		margin-bottom: 20px;
		font-size: 13px;
	}
	#special .summary .item:last-child h5 + p {
		margin-bottom: 0;
	}
	/* 3 */

	.specialList .listContent > .row:nth-child(3) h3 {
		margin-bottom: 28px;
	}
	.specialList .listContent > .row:nth-child(3) .text{
		color: #222;
		font-size: 12px;
		padding-left: 15px;
		padding-right: 15px;
		line-height: 1.4;
		margin-bottom: 20px;
	}
	.imageList {
		padding-left: 15px;
		padding-right: 15px;
		max-width: 640px;
		margin: 0 auto;
	}
	.imageList .listContent {
		display: block;
		margin-left: -7px;
		margin-right: -7px;
		
	}
	.imageList .row {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 50%;
		        flex: 0 0 50%;
		max-width: 50%;
		width: 50%;
		padding-left: 7px;
		padding-right: 7px;
		margin-bottom: 10px;
	}
	.imageList .row:first-child {
		margin: 0 auto 10px;
	}
	.imageList .row:nth-child(n+2) {
		float: left;
	}
	.specialList .listContent > .row:nth-child(3) .imageList .text {
		font-size: 10px;
		color: #666;
		margin-bottom: 30px;
	}
	.specialList .listContent > .row:nth-child(3) .btn {
		padding-left: 15px;
		padding-right: 15px;
	}
	.specialList .listContent > .row:nth-child(3) .btn a {
		display: inline-block;
	}
	.specialList .contentBottom {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-wrap: wrap;
  		flex-wrap: wrap;
	}
	.specialList .contentBottom .bottom {
		order: -1;
		flex: 1 0 100%;
	}
	.specialList .row .bottom {
		margin-bottom: 20px;
		color: #c70d0d;
		font-size: 10px;
		line-height: 1.5;
	}
	/* .footerTop
	-------------------------------------------------- */

	.footerTop {
		padding: 60px 0 75px;
	}
	.footerTop .cateList {
		padding-left: 15px;
		padding-right: 15px;
	}
	.cateList .listAbout {
		margin-bottom: 15px;
	}
	.cateList .listAbout .address{
		display: inline-block;
	}
	.cateList .row {
		margin-bottom: 20px;
		color: #000;
		font-size: 14px;
		font-weight: bold;
	}
	.cateList .row + .row {
		margin-top: 15px;
	}
	.cateList .row.large {
		font-size: 12px;
	}
	.cateList .link a {
		height: 98px;
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		/*background-color: #dcdcdc;*/
		color: #000;
		font-weight: bold;
		position: relative;
		
	}
	/*.cateList .link a:after {
		content: '';
		position: absolute;
		right: 0;
		bottom: 0;
		width: 110px;
		height: 22px;
		background-image: url(../img/sp/img_dummy.png);
		background-size: 110px 22px;
		background-repeat: no-repeat;
	}*/
	.cateList .row.large a {
		padding-right: 30px;
	}
	.cateList .row.large a:before {
		content: '';
		position: absolute;
		right: 10px;
		bottom: 50%;
		-webkit-transform: translateY(50%);
		    -ms-transform: translateY(50%);
		        transform: translateY(50%);
		width: 6px;
		height: 9px;
		background-image: url(../img/sp/img_arrow_right_btn.png);
		background-size: 6px 9px;
		background-repeat: no-repeat;
	}
	.cateList .socials {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
	}
	.cateList .socials li + li {
		margin-left: 10px;
	}
	.cateList .socials img {
		width: 30px;
	}
	
}