@media screen and (min-width: 2500px) {
    body {
        max-width: 2500px;
        margin: 0 auto;
    }

    #top__header .top__header-video iframe {
        width: 2500px !important;
        height: 1125px !important;
    }
}

@media screen and (min-width: 1700px) {
	body {
		width: 70%;
	}
}

@media screen and (max-width: 1700px) {
    #vision__mission .mtm-title {
        letter-spacing: 10px;
        font-size: 3.1rem;
    }

    #top__header__intro .thi-title {
        font-size: 4em;
    }
	
	#top__header__bar .top__header-menu > li {
		padding: 0.6rem;
}
	#top__header__bar .top__header-menu li > a {
		font-size: 1em;
	}
}

@media screen and (min-width: 1336px) and (max-width: 1479px) {
    #top__header__bar .top__header-menu > li {
        padding: 1rem .8rem;
    }

    #top__header__bar .top__header-faq {
        padding: 1rem;
        font-size: 0.9em;
    }
	#top__header__bar .top__header-menu > li {
		padding: 0.6rem;
}
	#top__header__bar .top__header-menu li > a {
		font-size: 0.85em;
	}
	#studios__teams .st-item .st-thumb {
		height: 160px;
	}
	#our__works .ow-partner li img {
		max-height: 58px;
	}
}

@media screen and (min-width: 1136px) and (max-width: 1335px) {
	body {
		width: 100%;
	}
    #top__header__bar .top__header-menu > li {
        padding: 1rem .5rem;
    }
	
	#top__header__bar .top__header-menu li > a {
		font-size: 1em;
	}	
	
    #top__header__bar .top__header-faq {
        padding: 0.4rem;
        font-size: 0.7em;
    }

    #top__header__bar .top__header-faq > a img {
        height: 15px;
    }
	

}

@media screen and (min-width: 991px) and (max-width: 1135px) {
	body {
		width: 95%;
	}
    #top__header__bar .top__header-logo img {
        min-height: 70px;
    }

	#top__header__bar .top__header-menu li > a {
		font-size: 0.8em;
	}

    #top__header__bar .top__header-menu > li {
        padding: 1rem .4rem;
    }

    #top__header__bar .top__header-faq {
        padding: 0.4rem;
        font-size: 0.55em;
    }

    #top__header__bar .top__header-faq > a img {
        height: 10px;
    }
}

@media screen and (max-width: 990px) {
	body {
		width: 100%;
	}
    #vision__mission .container,
    #business .container,
    #studios__teams .container,
    #service .container,
    #our__works .container,
    #news .container,
    #intro .sec-content,
    #intro .container,
    #main__footer .container {
        max-width: 100%;
    }

    #top__header {
        padding-top: 100px;
    }

    #top__header__bar {
        background: #ffffff;
        padding: 10px 5px;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1000;
        border: 0;
    }

    #top__header__bar .top__header-logo {
        justify-content: flex-start;
    }

    #top__header__bar .top__header-logo li img {
        height: 55px;
        max-height: 75px;
        min-height: 55px;
    }

    #top__header__bar .top__header-logo li:nth-child(2) {
        position: relative;
        top: auto;
    }

    #top__header__bar .top__header-menu li > a {
        font-size: 1em;
    }

    #top__header__bar .top__header-title {
        font-size: 1.3em;
    }

    #top__header__bar .top__header-group {
        position: fixed;
        top: 95px;
        bottom: 0;
        background: #ffffff;
        z-index: 1000;
        left: 0;
        overflow-y: auto;
        flex-direction: column;
        width: 100%;
        align-items: center;
        opacity: 0;
        visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #top__header__bar .top__header-group.show {
        opacity: 1;
        visibility: visible;
        backface-visibility: visible;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #top__header__bar .top__header-menu {
        flex-direction: column;
        flex-wrap: nowrap;
        width: 100%;
    }

    #top__header__bar .top__header-faq {
        width: 100%;
    }

    #top__header__bar .top__header-hamburger {
        display: flex;
        max-width: 50px;
    }

    #top__header__intro .thi-title {
        font-size: 5em;
    }

    #vision__mission .sec-col:nth-child(1) {
        max-width: 100%;
        margin: 0 auto;
        padding: 0 1em 2em;
    }

    #business .business-exchange {
        justify-content: center;
        display: block;
        width: 100%;
    }

    #business {
        padding: 4em 1em;
    }

    #service .mtm-title,
    #service .mtm-sub-title {
        padding-left: 15px;
        padding-right: 15px;
    }

    #news .sec-content {
        padding: 0 15px;
    }

    #news .news-table .news-col:nth-child(1) {
        flex: 0 0 120px;
    }

    #news .news-table .news-col:nth-child(2) {
        flex: 0 0 100px;
    }

    #news .news-table .news-col:nth-child(3) {
        flex: 0 0 calc(100% - 220px);
        max-width: calc(100% - 220px);
    }
}

@media screen and (max-width: 750px) {
	body {
		width: 100%;
	}
    /*===================Common==============*/
    .mtm-title {
        font-size: 2.4em;
    }

    /*============Top header==================*/
    #top__header {
        background: #ffffff url("./images/[RIKKEISOFT] Introduction_intro_1.jpg") center center no-repeat;
        background-size: cover;
    }

    #top__header__intro .thi-title {
        font-size: 4.5em;
        line-height: 1.3;
    }

    #top__header .top__header-video {
        display: none;
    }

    #top__header_scroll {
        display: flex;
        margin-top: auto;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        position: relative;
        padding: 10px 0;
    }

    #top__header_scroll img {
        max-height: 70px;
    }

    /*=========Vision and Mission==========*/
    #vision__mission {
        padding-top: 1em;
        padding-bottom: 1em;
        height: auto;
    }

    #vision__mission .container {
        max-width: 100%;
    }

    #vision__mission .mtm-title {
        padding-top: 1em;
        font-size: 2.4em;
    }

    #vision__mission .sec-col {
        width: 100%;
    }

     #vision__mission .sec-col:first-child {
        padding: 0 2em 2em;
     }

    /*=====Business====*/
    #business {
        padding: 2em 0 4em 0;
    }

    #business .container {
        max-width: 100%;
    }

    #business .container .sec-content {
        flex-direction: column;
        flex-wrap: nowrap;
    }

    #business .sec-col {
        order: 1;
        padding-left: 2em;
        padding-right: 2em;
        flex: 0 0 auto;
        display: flex;
        width: 100%;
    }

    #business .sec-col:first-child {
        order: 2;
    }

    #business .business-exchange {
        justify-content: center;
    }

    #business .business-exchange img {
        max-height: 1000px;
        max-width: 100%;
    }

    #business .container .sec-content {
        align-items: center;
    }

    /*=========Studio and Teams==========*/
    #studios__teams {
        padding-right: 0em;
        padding-left: 0em;
    }

    #studios__teams .container {
        max-width: 100%;
    }

    #studios__teams .mtm-title {
        margin-bottom: 1.2em;
    }

    #studios__teams .st-slider {
        flex-direction: column;
        padding: 1.2em 0;
    }

    #studios__teams .st-slider li {
        flex-basis: auto;
        display: table;
        padding: 0;
        background: #ffffff;
        margin: 7px 0;
        width: 100%
    }

    #studios__teams .st-item {
        display: block;
        flex-wrap: wrap;
        position: relative;
    }

    #studios__teams .st-item .st-title {
        float: right;
        width: 70%;
        text-align: left;
        padding: 10px 7px 5px 7px;
        font-size: 1.2em;
    }

    #studios__teams .st-item .st-thumb {
        float: left;
        width: 30%;
        height: 150px;
    }

    #studios__teams .st-item .st-thumb img {
        margin-right: auto;
        margin-left: 0;
        flex-basis: 100%;
    }

    #studios__teams .st-item .st-desc {
        float: right;
        width: 70%;
        text-align: left;
        padding: 5px 7px;
    }
	
	#studios__teams .container._full {
		margin-top: 0em;
	}

    /*========Service======*/
    #service {
        padding: 2em;
    }

    #service .container {
        max-width: 100%;
    }

    #service .mtm-title, #service .mtm-sub-title {
        padding-left: 0;
        padding-right: 0;
    }

    #service .service-list {
        margin: 0 -1em;
    }

    #service .service-item {
        padding: 1em;
    }

    /*=========Our work===========*/
    #our__works {
        padding: 2em;
    }

    #our__works .container {
        max-width: 100%;
    }

    #our__works .ow-partner {
        padding: 0;
    }

    /*======News=========*/
    #news {
        padding: 1em 2em;
    }

    #news .container {
        max-width: 100%;
    }

    #news .sec-col:first-child {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 1.5em;
    }

    #news .sec-col:last-child {
        max-width: 100%;
    }

    #news .news-more {
        padding: 0;
    }

    #news .news-more a {
        display: flex;
        align-items: center;
        width: 120px;
        justify-content: space-between;
        margin: auto;
        line-height: 1;
    }

    #news .sec-content {
        flex-direction: column;
        padding: 0;
    }

    #news .news-tabs li a.active {
        border-bottom: 5px solid #ba259c;
        color: #ba259c;
    }

    #news .news-table .news-col:nth-child(2) span {
        color: #ba259c;
    }

    /*=========Intro===========*/
    #intro {
        padding: 0 2em 2em 2em;
        background: #ffffff;
        min-height: 0;
    }

    #intro .sec-col {
        flex-basis: auto;
        padding: 15px 0;
        width: 100%;
        border-top: 1px dashed #cccccc;
    }

    #intro .sec-col:last-child {
        border-bottom: 1px dashed #cccccc;
    }

    #intro .sec-content {
        flex-flow: column nowrap;
        max-width: 100%;
    }

    #intro .intro-logo {
        height: 55px;
        justify-content: space-between;
        position: relative;
    }

    #intro .intro-logo::after {
        content: '';
        height: 30px;
        width: 30px;
        background: url("./images/ico-arrow-down.png") center center no-repeat;
        background-size: contain;
        position: absolute;
        top: 50%;
        margin-top: -15px;
        right: 0;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #intro .intro-logo.active::after {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #intro .intro-list {
        max-height: 0;
        width: 100%;
        overflow: hidden;
        padding: 0em 1.5em;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #intro .intro-list.active {
        max-height: 2000px;
        padding: 1em 0 0;
        -webkit-transition: 0.3s;
        -moz-transition: 0.3s;
        -ms-transition: 0.3s;
        -o-transition: 0.3s;
        transition: 0.3s;
    }

    #intro .intro-list .intro-row:last-child {
        border-bottom: 0;
    }

    /*========Contact us=======*/
    #contact__us {
        padding: 2em;
    }

    #contact__us .container {
        max-width: 100%;
    }

    #contact__us .cu-detail {
        flex-flow: column nowrap;
        background: transparent;
    }

    #contact__us .cu-d-item {
        padding: 1.5em 0.3em;
        margin-top: 7px;
        background: #ffffff;
        flex: 0 0 auto;
        width: 100%;

    }

    #contact__us .cu-d-item:first-child {
        border-right: 1px solid #333;
    }

    #contact__us .cu-d-label p {
        margin: 0;
    }

    /*============Main footer===========*/
    #main__footer .container {
        max-width: 100%;
    }

    #main__footer .mf-foot {
        padding: 0em;
        flex-flow: column nowrap;
    }

    #main__footer .mf-gotop .mf-gt-innner {
        margin-right: 3em;
    }

    #main__footer .mf-foot .mf-copyright {
        display: none;
    }

    #main__footer .mf-foot .mf-copyright.mb {
        order: 2;
        display: block;
        padding: 1em 0;
        text-align: center;
        border-top: 1px solid #ededed;
    }

    #main__footer .mf-foot .mf-company {
        order: 2;
        padding: 0.5em 2em;
        flex: 0 0 auto;
        width: 100%;
    }

    #main__footer .mf-foot .mf-logo {
        order: 1;
        padding: 1em 2em;
        flex-basis: auto;
        width: 100%;
    }

    #main__footer .mf-foot .mf-logo li {
        margin: 0;
    }

    #main__footer .mf-foot .mf-logo li img {
        max-height: 60px;
    }

    #main__footer .mf-foot .mf-site {
        order: 2;
        flex-flow: row wrap;
        flex: 1 1 auto;
        width: 100%;
        padding: 2em;
        justify-content: space-around;
        align-items: center;
    }

    #main__footer .mf-site .mf-mtm-logo {
        padding: 0;
    }

    #main__footer .mf-site .mf-mtm-site {
        width: auto;
        min-width: 200px;
    }
}

@media screen and (max-width: 640px) {
	body {
		width: 100%;
	}
    #top__header {
        padding-top: 83px;
    }

    #top__header__bar .top__header-group {
        top: 78px;
    }

    #top__header__bar {
        padding: 5px;
    }

    #top__header__bar .top__header-title {
        font-size: 1.15em;
    }

    #top__header__bar .top__header-logo li img {
        height: 50px;
        min-height: 1px;
    }

    #top__header__intro {
        max-width: 90%;
    }

    #top__header__intro .thi-title {
        font-size: 3.5em;
    }

    #top__header__intro .thi-large {
        font-size: 2em;
        margin-top: -1.5em;
    }

    #service .service-list .sec-col {
        flex-basis: 50%;
    }
}

@media screen and (max-width: 540px) {
    .mtm-title, #vision__mission .mtm-title {
        font-size: 2em;
    }

    .mtm-sub-title {
        font-size: 1.5em;
    }

    #top__header {
        min-height: 700px;
    }

    #top__header__intro {
        max-width: 100%;
        padding-left: 1em;
        padding-right: 1em;
    }

    #top__header_scroll img {
        max-height: 40px;
    }

    #vision__mission .mtm-sub-title {
        padding: 1.2em 0;
    }

    #vision__mission .sec-col:first-child {
        padding-left: 1em;
        padding-right: 1em;
    }

    #business .sec-col {
        padding-left: 1em;
        padding-right: 1em;
    }

    #business .business-exchange img {
        width: auto;
    }

    #service, #our__works, #news, #intro, #contact__us {
        padding: 1.5em 1em;
    }


    #our__works .ow-partner li {
        padding: 0.2em 1em;
    }

    #our__works .ow-partner li img {
        max-height: 65px;
    }

    #news .news-tabs li {
        min-width: 90px;
    }

    #news .sec-col:last-child {
        padding-top: 0;
    }

    #intro {
        padding-top: 0;
    }

    #intro .intro-list .intro-col .link-visit {
        flex: 0 0 auto;
        max-width: 100px;
        padding: 0 5px;
        font-size: 0.8em;
    }

    #contact__us .cu-d-label, #contact__us .cu-d-label * {
        font-size: 3rem
    }

    #contact__us .cu-d-ico {
        width: 50px;
        margin-right: 0px;
    }

    #contact__us .cu-d-ico img {
        max-height: 30px;
    }

    #contact__us .cu-d-label p {
        font-size: 1rem;
    }

    #main__footer .mf-site .mf-mtm-logo img {
        max-height: 30px;
    }

    #main__footer .mf-site .mf-mtm-site {
        min-width: 150px;
    }

    #main__footer .mf-site .mf-mtm-site a {
        line-height: 1.5;
    }
}

@media screen and (max-width: 480px) {
    body {
        font-size: 14px;
		width: 100%;
    }

    .mtm-title {
        font-size: 1.7em;
        letter-spacing: 12px;
    }

    .mtm-sub-title {
        font-size: 1.2em;
    }

    #top__header {
        padding-top: 65px;
        min-height: 550px;
    }

    #top__header__bar .top__header-logo li img {
        height: 40px;
    }

    #top__header__bar .top__header-title {
        font-size: 1em;
        font-weight: normal;
    }

    #top__header__bar .top__header-group {
        top: 62px;
    }

    #top__header__bar .top__header-hamburger .hamburger-icon {
        width: 30px;
    }

    #top__header__bar .top__header-hamburger .hamburger-icon::before,
    #top__header__bar .top__header-hamburger .hamburger-icon::after {
        height: 5px;
    }

    #top__header__intro .thi-large {
        font-size: 1.5em;
    }

    #top__header__intro .thi-title {
        font-size: 2.2em;
    }

    #service, #our__works, #news, #intro, #contact__us {
        padding: 1em 0.5em;
    }

    #vision__mission p,
    #business .business-content p {
        font-size: 1em;
        text-align: justify;
    }

    #vision__mission {
        min-height: 100px;
    }

    #vision__mission .mtm-title {
        font-size: 1.7em;
    }

    #vision__mission .container {
        flex-direction: column;
    }

    #vision__mission .sec-col {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    #business {
        padding: 2em 0;
    }

    #business .mtm-sub-title {
        margin-top: 0.4em;
    }

    #business .sec-col {
        padding: 0 1em;
    }

    #studios__teams .st-item .st-thumb {
        height: 120px;
    }

    #studios__teams {
        padding-top: 1em;
        padding-bottom: 1em;
    }

    #service .service-item .bracket-icon {
        width: 120px;
        height: 120px;
    }

    #service .service-list {
        margin: 0 0.5em;
    }

    #service .service-item {
        padding: 1em 0.4em;
    }

    #service .service-item .service-heading-wrapper .service-heading-title {
        line-height: 20px;
        margin: 10px 0;
        font-size: 1.1em;
        font-weight: bold;
    }

    #service .service-item .service-desc {
        font-size: 1em;
    }

    #service .btn-group .btn-default {
        height: 35px;
        font-size: 1em;
    }

    #our__works .ow-partner li img {
        max-height: 50px;
    }

    #news .news-tabs li {
        min-width: 1px;
        flex-grow: 1;
    }
    #news .news-content {
        min-height: 340px;
    }

    #news .news-table .news-row {
        flex-wrap: wrap;
        padding-top: 7px;
        padding-bottom: 7px;
        min-height: 80px;
    }

    #news .news-table .news-col:nth-child(1) {
        flex: 0 0 95px;
        color: #8a8a8a;
    }

    #news .news-table .news-col:nth-child(2) span {
        border-right: 0;
    }

    #news .news-table .news-col:nth-child(3) {
        flex: 0 0 auto;
        flex-basis: 100%;
        max-width: 100%;
        margin-top: 5px;
    }

    #news .news-table .news-col:nth-child(3) a {
        white-space: normal;
    }


    #main__footer .mf-foot .mf-logo li img {
        max-height: 50px;
    }

    #main__footer .mf-foot .mf-logo,
    #main__footer .mf-foot .mf-company {
        padding: 0.5em 0.7em;
    }

    #intro {
        padding-top: 0;
    }

    #intro .intro-logo img {
        max-height: 40px;
    }

    #intro .intro-logo::after {
        height: 20px;
        width: 20px;
        margin-top: -10px;
    }

    #main__footer .mf-foot .mf-site {
        padding: 1em 0.5em;
    }

    #main__footer .mf-site .mf-mtm-site a {
        font-size: 0.9em;
    }
}


@media screen and (max-width: 360px) {
	body {
        font-size: 14px;
		width: 100%;
    }
    #service .service-list .sec-col {
        flex-basis: 100%;
    }

    #service .service-item {
        padding: 1.2em 0;
    }

    #main__footer .mf-site .mf-mtm-logo img {
        max-height: 25px;
    }

    #main__footer .mf-site .mf-mtm-site {
        min-width: 140px;
    }
}