@charset "UTF-8";
.first{
position: fixed;
top: 0;
bottom: 0;
left: 0;
right:0;
z-index: 2000;
background-color: rgba( 255, 255, 255, 1);
display: none;
}
.first.active{
display: block;
}
.first .image{
position: absolute;
top: 50%;
left: 50%;
max-width: 1008px;
width: 80%;
transform: translateX( -50% ) translateY( -50% );
display: none;
}
.wrap_1280{
max-width: 1280px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 800px) {
.introduction .head,
.movie .head,
.interview .head,
.story_character .head,
.staff_cast .head,
.news .head{
margin-bottom: 8px;
}
.introduction .body,
.movie .body,
.interview .body,
.story_character .body,
.staff_cast .body,
.news .body{
padding-top: calc( ( 73 * ( 100vw - 70px ) ) / 800 );
}
.top .nav_wrap{
position: fixed;
left: 0;
right: 0;
top: 50px;
background-color: rgba( 255, 255, 255, .85);
z-index: 4;
}
.top .nav_box{
display: none;
}
.top .nav{
padding-bottom: 4.5vw;
}
.top .nav li {
float: left;
line-height: 2;
text-align: center;
font-size: 4.5vw;
margin-top:4.5vw;
}
.top .nav li{
width: calc( 100% / 3 );
}
.top .nav li:nth-child(4){
width: calc( 200% / 3 );
}
.top .nav li:nth-child(1),
.top .nav li:nth-child(2),
.top .nav li:nth-child(4){
border-right: solid #122447 1px;
}
.top .nav li a{
display: block;
}
}
.top,
.introduction,
.movie,
.interview,
.story_character,
.staff_cast,
.news{
position: relative;
}
.introduction .head,
.movie .head,
.interview .head,
.story_character .head,
.staff_cast .head,
.news .head{
top: 0;
left:0;
right: 70px;
position: absolute;
}
.introduction.current .head,
.movie.current .head,
.interview.current .head,
.story_character.current .head,
.staff_cast.current .head,
.news.current .head{
position: fixed;
z-index: 1
}

/*201812_add*/
	.allwrap {
		overflow: hidden;
	}
	.header p {
		width: 100%;
		margin: -40px auto 15px;
		text-align: center;
	}
	.header p img {
		width: auto;
	}
	
	/*nav*/
	
	.zdo_drawer_menu * {
	  margin: 0;
	  padding: 0;
	  outline: none;
	  border: none;
	  font-weight: inherit;
	  -webkit-appearance: none;
	  -moz-appearance: none;
	  appearance: none;
	  text-align: left;
	  text-decoration: none;
	  list-style: none;
	}
	
	.zdo_drawer_menu a {
	  color: inherit;
	  text-decoration: none;
	}
	
	.zdo_drawer_menu a:visited {
	  color: inherit;
	}
	
	.zdo_drawer_menu .zdo_drawer_bg {
	  width: 100%;
	  height: 100%;
	  position: fixed;
	  z-index: 3;
	  background-color: rgba(51, 51, 51, 0.5);
	  display: none;
	  top: 0;
	  left: 0;
	}
	
	.zdo_drawer_menu .zdo_drawer_button {
	  display: block;
	  background: none;
	  border: none;
	  padding: 0;
	  width: 42px;
	  letter-spacing: 0.1em;
	  cursor: pointer;
	  position: absolute;
	  top: 8px;
	  right: 32px;
	  z-index: 1001;
	  text-align: center;
	  outline: none;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_bar {
	  width: 49px;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_bar1 {
	  transform: rotate(30deg);
	  background: #fff;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_bar2 {
	  opacity: 0;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_bar3 {
	  transform: rotate(-30deg);
	  background: #fff;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_menu_text {
	  display: none;
	}
	
	.zdo_drawer_menu .zdo_drawer_button.active .zdo_drawer_close {
	  display: block;
	  color: #fff;
	}
	
	.zdo_drawer_menu .zdo_drawer_bar {
	  display: block;
	  height: 3px;
	  margin: 10px 0;
	  transition: all 0.2s;
	  transform-origin: 0 0;
	}
	
	.zdo_drawer_menu .zdo_drawer_text {
	  text-align: center;
	  font-size: 10px;
	}
	
	.zdo_drawer_menu .zdo_drawer_close {
	  letter-spacing: 0.08em;
	  display: none;
	}
	
	.zdo_drawer_menu .zdo_drawer_menu_text {
	  display: block;
	  position: absolute;
      top: 38%;
      right: -42px;
	}
	
	.zdo_drawer_menu .zdo_drawer_nav_wrapper {
	  width: 312px;
	  height: auto;
	  transition: all 0.2s;
	  transform: translate(312px);
	  position: fixed;
	  top: 0;
	  right: 0;
	  z-index: 1000;
	  background-color: #FFF;
	}
	
	.zdo_drawer_menu .zdo_drawer_nav_wrapper.open {
	  transform: translate(0);
	}
	
	.zdo_drawer_menu.left .zdo_drawer_button {
	  right: auto;
	  left: 15px;
	}
	
	.zdo_drawer_menu.left .zdo_drawer_nav_wrapper {
	  transform: translate(-312px);
	  right: auto;
	  left: 0;
	}
	
	.zdo_drawer_menu.left .zdo_drawer_nav_wrapper.open {
	  transform: translate(0);
	  background: #e13075;/*背景色*/
	}
	
	/*+++ Default Navigation CSS +++*/
	.zdo_drawer_menu .zdo_drawer_nav {
	  padding: 100px 24px 56px;
	}
	.zdo_drawer_nav.menu02 {
		padding: 35px 24px 80px;
	}
	
	.zdo_drawer_menu .zdo_drawer_nav li {
	  font-size: 16px;
	  margin: 0 30px 30px;
	}
	
	/*+++ Default Button Color +++*/
	.zdo_drawer_menu .zdo_drawer_button {
	  color: #2d2d2d;
	}
	
	.zdo_drawer_menu .zdo_drawer_button .zdo_drawer_bar {
	  background-color: #2d2d2d;
	}
	.zdo_drawer_menu img {
		width: auto;
	}
	.zdo_drawer_nav_wrapper p.new {
		padding: 5% 0 6%;
		border-top: 1px solid #fff;
    	border-bottom: 1px solid #fff;
	}
	.zdo_drawer_menu {
		overflow-y: scroll;
	}
	
	#header {
	  padding: 26px;
	}
	
	.header .headerTxt {
		background-color: #e13075;
		color: #fff;
		margin: 10px 0 0 0;
		font-family: "游ゴシック", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
	}
	.header .headerTxt .text {
		width:100%;
		padding-left: 100%;
		display: inline-block;
		white-space: nowrap;
		-webkit-animation-name: marquee;
		-webkit-animation-timing-function: linear;
		-webkit-animation-duration: 20s;
		-webkit-animation-iteration-count: infinite;
		-moz-animation-name: marquee;
		-moz-animation-timing-function: linear;
		-moz-animation-duration: 20s;
		-moz-animation-iteration-count: infinite;
		-ms-animation-name: marquee;
		-ms-animation-timing-function: linear;
		-ms-animation-duration: 20s;
		-ms-animation-iteration-count: infinite;
		-o-animation-name: marquee;
		-o-animation-timing-function: linear;
		-o-animation-duration: 20s;
		-o-animation-iteration-count: infinite;
		animation-name: marquee;
		animation-timing-function: linear;
	    animation-duration: 20s;
		animation-iteration-count: infinite;
		text-align: left;
	}
	@keyframes marquee {
    	from    { transform: translate(0%); } 
    	100%,to { transform: translate(-100%); }
	}
	.top{
	background-image: url(../../machikoi/images/mv_bg.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	}
	.header .headerTxt::before {
		content:"";
		background-image: url(../images/header_newstopics.png);
		background-repeat: no-repeat;
		width: 128px;
		height: 40px;
		position: absolute;
		top: 30px;
		right: 0;
	}
	.body .mvWrap img {
		width: auto;
	}
	.body .mvWrap {
		width: 100%;
		padding: 5% 3% 3%;
	}
	.body .mvWrap .mvTxt {
		float: left;
		width: 30%;
	}
	.body .mvWrap .videoBox {
		width: 66%;
		height: 0;
		float: right;
		padding-top: 37.25%;
		position: relative;
	}
	.body .mvWrap .videoBox iframe {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	/*.body .mvWrap ul {
		display: flex;
		flex-wrap: wrap;
		padding: 10px;
	}
	.body .mvWrap ul li {
		width: calc(20% - 10px);
    	margin: 5px;
	}*/
	.body .mvWrap .mvLinkWrap {
		background: url(../images/mv_illust01.png) 68% 15px no-repeat;
		margin: 30px 0 0;
	}
	.body .mvWrap ul.mvLinkL {
		margin-bottom: 20px;
		float: left;
		width: 30%;
		display: flex;
	}
	.body .mvWrap p.mvLinkR {
		margin-bottom: 20px;
		float: right;
		width: 25%;
		display: flex;
	}
	
	.body .mvWrap ul li {
		padding: 0 1% 0;
		display: inline-block;
	}
	

@media screen and (min-width: 801px) and (max-width: 1130px) {
	.body .mvWrap .mvLinkWrap {
		background: url(../images/mv_illust01.png) 65% -2px no-repeat;
		background-size: contain;
		padding: 0 0 10px 0;
		margin: 20px 0 0;
	}
	.body .mvWrap ul.mvLinkL {
		width: 50%;
	}
	.body .mvWrap p.mvLinkR {
		width: 25%;
	}
	.body .mvWrap img {
		width: 100%;
	}
	
	
}

@media screen and (max-width: 800px) {
	.header p.logo img {
		width: 40%;
	}
	.body .mvWrap .mvTxt {
		float: none;
		width: 100%;
	}
	.body .mvWrap .mvTxt img {
		width: 100%;
	}
	.body .mvWrap .videoBox {
		width: 100%;
		float: none;
		padding-top: 55%;
	}
	.body .mvWrap ul.mvLinkL {
		float: none;
		width: 100%;
	}
	.body .mvWrap ul img {
		width: 100%;
	}
	.body .mvWrap .mvLinkWrap {
		background: url(../images/mv_illust01.png) 6% 98% no-repeat;
		background-size: 42%;
	}
	.body .mvWrap p.mvLinkR {
		float: none;
		width: 50%;
		display: inherit;
		margin: 0px 0 0 51%;
	}
	.body .mvWrap p.mvLinkR img {
		width: 96%;
	}
	.header .headerTxt::before {
		/*background-size: 100%;
		width: 90px;
		top: 40px;*/
		background: none;
	}
	img.contentHead {
		width: 80%;
	}
}


@media screen and (min-width: 801px) {
.introduction .head,
.movie .head,
.interview .head,
.story_character .head,
.staff_cast .head,
.news .head{
right: 0;
border-top: solid #e13075 5px;
}
.introduction .head .image,
.movie .head .image,
.interview .head .image,
.story_character .head .image,
.staff_cast .head .image,
.news .head .image{
margin-top: -2px;
width: 272px;
}
.top .body,
.movie .body,
.interview .body,
.story_character .body,
.staff_cast .body,
.news .body{
max-width: 1280px;
margin-left: auto;
margin-right: auto;
}
.top .body{
position: relative;
z-index: 1;
}
/*.top{
background-image: url(../../machikoi2/images/top_bg.jpg);
background-repeat: no-repeat;
background-position: center top;
background-size: auto 100%;
}*/

.top .nav_wrap{
position: absolute;
left: 0;
right: 0;
top: 88%;
bottom: 0;
background-color: rgba( 255, 255, 255, .8);
}
.top .nav_box{
position: absolute;
top: 0;
bottom: 0;
z-index: 2;
}
.top .nav{
position: absolute;
left: 28%;
right: 0;
top: 50%;
bottom: 0;
transform: translateY(-50%);
}
.top .nav li {
float: left;
line-height: 2;
}
.top .nav li:not(:first-child) {
margin-left: 1em;
border-left: solid #122447 1px;
padding-left: 1em;
}
}
.top .nav li {
position: relative;
}
.top .nav li.new:before {
position: absolute;
content: 'NEW';
color: #fff;
background-color: #f00;
top: -16px;
left: 10px;
line-height: 1;
padding:4px 6px;
font-size: 14px;
}
@media screen and (min-width: 801px) and (max-width: 1280px){
.top .nav_box{
left: 0;
right: 0;
}
.top .nav{
font-size: 1.875vw;
}
}
@media screen and (min-width: 1281px) {
.top .nav_box{
left: calc( 50% - 640px );
right: calc( 50% - 640px );
}
.top .nav{
font-size: 21px;
}
}
.nav .nav_movie .small{
font-size: .7em;
}

.nav {
color: #122447;
}
.nav a,
.nav a:link,
.nav a:hover,
.nav a:visited,
.nav a:active {
color: #122447;
}
.introduction{
padding-bottom: 60px;
}
.introduction .body .directer{
font-size: 14px;
max-width: 810px;
padding-left: 20px;
padding-right: 10px;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
}
.introduction .body .directer .image{
float: left;
}
.introduction .body .directer .text .title .white-space_nowrap{
white-space: nowrap;
}
@media screen and (max-width: 800px) {
.introduction .body .directer .image{
margin-left: -10px;
margin-right: 10px;
width: 120px;
}
.introduction .body .directer .text .role{
padding-top: 10px;
font-size: 12px;
}
.introduction .body .directer .text .title{
font-size: 12px;
}
.introduction .body .directer .text .name_j{
font-size: 32px;
}
.introduction .body .directer .text .name_e{
font-size: 12px;
}
}
@media screen and (min-width: 801px) {
.introduction .body .directer .image{
width: 170px;
}
.introduction .body .directer .text{
padding-top: 20px;
float: right;
width: calc( 100% - 198px );
line-height: 1;
}
.introduction .body .directer .text .role{
padding-top: 20px;
}
.introduction .body .directer .text .title{
margin-top: 8px;
font-size: 18px;
}
.introduction .body .directer .text .name_j{
margin-top: 8px;
font-size: 32px;
}
.introduction .body .directer .text .name_e{
margin-top: 8px;
font-size: 12px;
}
}
.introduction .body .directer .text .role{
font-size: 14px;
}
.introduction .body .directer .text .biography{
margin-top: 32px;
font-size: 16px;
line-height: 28px;
}
.introduction .body .directer .text .history_head{
margin-top: 24px;
font-size: 14px;
}
.introduction .body .directer .text .history_body{
margin-top: 8px;
font-size: 16px;
line-height: 32px;
padding-left: 8px;
}
.introduction .body .directer .text .history_body p{
text-indent: -1em;
}
.introduction .body .directer .text .comment_head{
margin-top: 24px;
font-size: 18px;
}
.introduction .body .directer .text .comment_lede{
margin-top: 16px;
margin-bottom: 16px;
font-size: 22px;
line-height: 48px;
color: #123d90;
}
.introduction .body .directer .text .comment_lede .letter-spacing_half{
letter-spacing: -.5em;
}
.introduction .body .directer .text .comment_body{
margin-top: 8px;
font-size: 16px;
line-height: 36px;
}
.movie .body{
width: 80%;
margin-left: auto;
margin-right: auto;
}
.movie .body .movie_box .video,
.movie .body .movie_box2 .video{
background-color: #000;
border-radius: 10px;
box-shadow: 4px 4px 32px;
}
.movie .body .movie_box .video,
.movie .body .movie_box2 .video{
position: relative;
width: 100%;
height: 0;
padding-top: 56.25%;
}
.movie .body .movie_box .video iframe,
.movie .body .movie_box2 .video iframe{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.movie .body .movie_box .text,
.movie .body .movie_box2 .text{
margin-bottom: 20px;
text-align: center;
font-size: 20px;
font-weight: 700;
font-family:"游ゴシック medium" , "Yu Gothic medium" , "游ゴシック体" , "YuGothic"  ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
@media screen and (max-width: 800px) {
.movie .body{
padding-bottom: 40px;
width: 80%;
}
.movie .body .movie_box:nth-child(1){
padding-top: 40px;
margin-bottom: 40px;
}
.story_character .body .story{
padding-top: 80px;
}
.staff_cast .body .item:nth-child(1){
padding-top: 80px;
}
.news .body .item:nth-child(1){
padding-top: 30px;
}
}
@media screen and (min-width: 801px) {
.movie .body{
padding-top: 80px;
padding-bottom: 60px;
}
.movie .body .movie_box{
width: 47%;
}

.movie .body .movie_box2{
width: 80%;
margin: 0 auto 30px;
}

.movie .body .movie_box:nth-child(1){
float: left;
}
.movie .body .movie_box:nth-child(2){
float: right;
}
.story_character .body{
padding-top: 80px;
}
.staff_cast .body{
padding-top: 80px;
}
.news .body{
padding-top: 40px;
}
}
.story_character .body{
padding-bottom: 60px;
}
.story_character .body .story{
margin-bottom: 60px;
}
.story_character .character_designer_wrap{
background-color: #e9f0f8;
width: 100%
}
.story_character .character_designer{
padding-left: 30px;
padding-right: 10px;
padding-top: 40px;
padding-bottom: 40px;
margin-left: auto;
margin-right: auto;
}
}
@media screen and (max-width: 1200px) {
.story_character .character_designer{
}
}
@media screen and (min-width: 1061px) {
.story_character .character_designer{
width: calc( 100% );
}
}


@media screen and (max-width: 800px) {
.story_character .character_designer{
max-width: 480px;
}
.story_character .character_designer .image{
margin-left: -10px;
margin-right: 10px;
width: 120px;
}
.story_character .character_designer .text .role{
}
.story_character .character_designer .text .role{
font-size: 12px;
}
.story_character .character_designer .text .title{
font-size: 12px;
}
.story_character .character_designer .text .name_j{
font-size: 32px;
}
.story_character .character_designer .text .name_e{
font-size: 12px;
}
.story_character .character_designer .text .history_body{
margin-top: 8px;
padding-left: .5em;
}
.story_character .character_designer .text .history_body p{
text-indent: -1em;
}
}
@media screen and (min-width: 801px) {
.story_character .character_designer{
max-width: 1140px;
}
.story_character .character_designer .text{
line-height: 1;
}
.story_character .character_designer .text .role{
padding-top: 20px;
}
.story_character .character_designer .text .title{
margin-top: 8px;
font-size: 18px;
}
.story_character .character_designer .text .name{
margin-top: 16px;
}
.story_character .character_designer .text .name_j{
font-size: 32px;
}
.story_character .character_designer .text .name_e{
font-size: 12px;
}
.story_character .character_designer .text .image{
float: left;
margin-left: -10px;
margin-right: 20px;
width: 120px;
margin-top: 8px;
}
.story_character .character_designer .text .biography{
float: left;
margin-top: 8px;
width: 336px;
}
.story_character .character_designer .text .history_head{
float: right;
margin-bottom: 8px;
width: calc( 100% - 120px - 10px - 20px - 336px)
}
.story_character .character_designer .text .history_body{
float: right;
width: calc( 100% - 120px - 10px - 20px - 336px - .5em );
}
.story_character .character_designer .text .history_body p{
text-indent: -1em;
}
}
.story_character .character_designer .text .role{
font-size: 14px;
}
.story_character .character_designer .text .biography{
font-size: 14px;
line-height: 28px;
}
.story_character .character_designer .text .history_head{
font-size: 12px;
}
.story_character .character_designer .text .history_head{
margin-top: 8px;
}
.story_character .character_designer .text .history_body{
font-size: 14px;
line-height: 24px;
}
.story_character .character_designer .text .comment_body{
margin-top: 8px;
font-size: 16px;
line-height: 36px;
}

.staff_cast{
text-align: center;
line-height: 1.75;
}
/*20181228add*/
.staff_cast p.image {
	text-align:left;
}/*20181228end*/
.staff_cast .body{
padding-bottom: 60px;
}
.staff_cast .body .item:nth-child(1){
font-size: 16px;
}
.staff_cast .body .item:nth-child(2){
font-size: 24px;
margin-bottom: 16px;
}
.staff_cast .body .item:nth-child(3){
width: 30%;
max-width: 120px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 800px) {
.staff_cast .body .item:nth-child(4) br{
display: none;
}
}

@media screen and (min-width: 801px) {
.staff_cast .body .item:nth-child(4){
width: 752px;
margin-left: auto;
margin-right: auto;
}
}

.staff_cast .body .item:nth-child(4){
margin-top:20px;
font-size: 16px;
}
@media screen and (max-width: 800px) {
.staff_cast .body .item:nth-child(4){
text-align: left;
padding-left: 20px;
padding-right: 20px;
max-width: 520px;
margin-left: auto;
margin-right: auto;
}
}
.staff_cast .body .item:nth-child(5){
margin-top:16px;
font-size: 14px;
}
.staff_cast .body .item:nth-child(6){
font-size: 14px;
}
.staff_cast .body .item:nth-child(7){
margin-top:16px;
font-size: 16px;
}
.staff_cast .body .item:nth-child(7) p{
width: calc( 50% - 8px );
}
.staff_cast .body .item:nth-child(7) p:nth-child(2n+1){
float: left;
text-align: right;
}
.staff_cast .body .item:nth-child(7) p:nth-child(2n){
float: right;
text-align: left;
}
.staff_cast .body .item:nth-child(8){
margin-top:32px;
font-size: 16px;
}
.staff_cast .body .item:nth-child(9),
.staff_cast .body .item:nth-child(13){
margin-top:24px;
}
.staff_cast .body .item:nth-child(9) span:nth-child(1),
.staff_cast .body .item:nth-child(13) span:nth-child(1){
font-size: 20px;
}
.staff_cast .body .item:nth-child(9) span:nth-child(2),
.staff_cast .body .item:nth-child(13) span:nth-child(2){
font-size: 14px;
}
.staff_cast .body .item:nth-child(10),
.staff_cast .body .item:nth-child(14){
font-size: 14px;
}
.staff_cast .body .item:nth-child(11),
.staff_cast .body .item:nth-child(15){
margin-top: 16px;
border-top: solid #000 1px; 
padding-top: 16px;
padding-left: 2em;
padding-right: 2em;
margin-right: auto;
margin-left: auto;
display: inline-block;
font-size: 14px;

}
.staff_cast .body .item:nth-child(12){
font-size: 14px;
}
.staff_cast .body .item:nth-child(13){
font-size: px;
}
.staff_cast .body .item:nth-child(14){
font-size: px;
}
.staff_cast .body .item:nth-child(15){
font-size: px;
}
.staff_cast .body .item:nth-child(16){
font-size: px;
}
.staff_cast .body .item:nth-child(17){
font-size: px;
}
.staff_cast .body .item:nth-child(){
font-size: px;
}
.staff_cast .body .item:nth-child(){
font-size: px;
}
.staff_cast .body .item:nth-child(){
font-size: px;
}
.news .body{
padding-bottom: 40px;
}

@media screen and (max-width: 800px) {
.news .item{
padding-right: 20px;
padding-left: 20px;
margin-top:40px;
}
}
@media screen and (min-width: 801px) {
.news .item{
max-width: 728px;
margin-top:40px;
margin-left: auto;
margin-right: auto;
}
}


@media screen and (max-width: 800px) {
.interview {
}
}
@media screen and (min-width: 801px) {
.interview{
padding-top: 30px;
}
.interview .bg{
background-image: url(../../machikoi/images/interview_pc.png);
background-position: center top;
background-repeat: no-repeat;
background-size: auto 100%;
}
}

.pagetop {
  display: none;
  position: fixed;
  z-index: 3;
  width: auto;
  bottom: 30px;
  right: 15px;
}
.pagetop a {
  display: block;
}
.pagetop a:hover {
  display: block;
}

@media screen and (max-width: 640px) {
  .pagetop {
    width: 20%;
}
  .news {
    margin-bottom: 100px;
  }
  .movie .body .movie_box .text,
  .movie .body .movie_box2 .text{
    margin: 30px 0 20px;
  }