@charset "utf-8";

@media only screen and (max-width: 768px) {
	header div.title {
		background: url(../../images/common/mv_bg_sp.png) no-repeat center bottom /contain;
		background-color: #05075A;
		align-items: flex-start;
		justify-content: flex-start;
		flex-wrap: wrap;
		min-width: 100% !important;
		margin: 50px auto 0;
		min-height: 750px;
	}
	header div.title .wrap {
		width: 95%;
		margin: 60px auto;
	}
	header .walkme_title {
	    font-size: 40px;
	    margin: 10px 0;
	}
	header .walkme_value {
	    font-size: 18px;
	}
	header .linkbtn {
	    width: 50%;
	}
	header .linkbtn a {
	    font-size: 16px;
	    padding: 15px 0;
	}
	header div.title .tagline {
		font-size: 19px;
		margin: 30px auto 0;
	}
	header div.title h1 {
		font-size: 28px;
		margin: 0;
		display: none;
	}
	header div.title .subtitle {
		font-size: 18px;
	}
	header .walkme_sub_title {
		font-size: 24px;
		margin: 5px 0;
	}
	header .walkme_value br.sp_on {
		display: inline-block;
	}
	header div.title .info {
		font-size: 16px;
		margin: 10px auto 30px;
	}
	header div.title .info span {
		display: block;
		margin: 6px auto 0;
	}
	h3 {
		font-size: 22px;
		margin-bottom: 40px;
	}
	h3:before {
		top: 30px;
		width: 140px;
	}
	h3 > span {
		font-size: 14px;
		margin-top: 20px;
	}

	.all-wrap {
		margin-top: 0;
		padding-top: 0;
	}

	/* for fixed nav */
	#greeting::before,
	#outline::before,
	#topics::before,
	#live::before,
	#faq::before {
		height: 0;
		margin-top: 0;
	}

	/* message */
	#message {
		width: 94%;
		padding: 65px 2%;
		white-space: normal;
	}
	#message:after {
	    bottom: 2%;
	    height: 150px;
	    width: 100%;
	    background: url(../../images/top/message_after_parts.png) no-repeat center / contain;
	}
	#message h2 {
	    font-size: 22px;
	    margin: 0 auto 20px;
	}
	#message p {
		font-size: 13px;
	}

	/* greeting */
	#greeting {
		width: 90%;
		min-width: 90%;
		margin: 0 auto;
		padding: 40px 0 20px;
	}
	#greeting p {
		font-size: 13px;
		line-height: 1.8;
	}
	/* speakers */
	#speakers {
		padding: 65px 0;
	}
	#speakers h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	.speaker_list {
		gap: 15px;
	}
	.speaker_list li {
		width: 45%;
	}
	.speaker_list li .speaker_icon img {
		width: 100%;
		height: auto;
	}
	.speaker_list li p.name {
		font-size: 16px;
		margin: 10px 0;
	}
	.speaker_list li p.position {
		font-size: 13px;
	}
	#speakers .speakers_more {
		margin: 40px 0 0;
	}

	/* outline */
	#outline {
		min-width: 100%;
		padding: 40px 0;
	}
	#outline h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	#outline .wrap {
		width: 94%;
		padding: 40px 0 30px;
	}
	#outline table {
		width: 96%;
		margin: 0 auto 36px;
	}
	#outline table tr th {
		font-size: 13px;
		border-bottom: 1px solid #333;
	}
	#outline table tr td {
		font-size: 14px;
		border-bottom: 1px solid #333;
	}
	#outline table tr th {
		width: 100%;
        min-width: auto;
        text-align: left;
        display: block;
        padding: 15px 15px 0;
        border-bottom: none;
	}
	#outline table tr td {
		padding: 15px;
		width: 100%;
		display: block;
	}
	#outline table tr td div {
		border-left: 2px solid #c1d42f;
		padding: 0 10px;
	}
	#outline table tr td div p.address {
		font-size: 10px;
		padding: 0;
		margin: 12px 0 0 0;
	}
	#outline .map {
		width: 100%;
		max-width: 100%;
		height: 250px;
	}

	/* topics */
	#topics {
		padding: 0 10px;
	}
	#topics h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	#topics .wrap {
		padding: 40px 0;
	}
	
	ul.topics li {
		min-height: auto;
	}
	ul.topics li h3 {
	    font-size: 18px;
	    margin: 0 0 15px;
	    text-align: center;
	}
	ul.topics li .description {
		font-size: 13px;
	}
	ul.topics li .cnt {
		flex-wrap: wrap;
	}
	ul.topics li .cnt .thumbnail {
		width: 50%;
		margin: 0 auto 15px;
	}
	ul.topics li .cnt .text {
		width: 100%;
	}
	ul.topics li h4 {
		font-size: 16px;
	}
	ul.topics li p {
		font-size: 13px;
	}
	#mini-session h3 {
		font-size: 18px;
		margin: 0 0 15px;
	}
	#mini-session .wrap {
		padding: 20px 0;
	}
	#mini-session table {
		border-spacing: 0px 5px;
	}
	#mini-session table th,
	#mini-session table td {
		padding: 5px;
		font-size: 13px;
	}
	#mini-session table th {
		width: 28%;
		font-size: 13px;
	}
	#mini-session table th .bar {
		margin: 0 3px;
	}
	#mini-session table td .program-container {
		gap: 0 10px;
	}
	#mini-session table td .session1 {
		gap: 0 10px;
	}
	#mini-session table td .program-container .title {
		width: 60%;
	}
	#mini-session table td .program-container .speaker{
		width: 38%;
	}


	/* live */
	#program {
		padding: 40px 10px;
		min-width: 100%;
		
		background: 
		  url(../../images/common/agenda_bg_line01.png) no-repeat top left/contain,
		  url(../../images/common/agenda_bg_line02.png) no-repeat bottom right/contain,
		  var(--navy);
	}
	#program h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	#program .wrap .title-container {
		padding: 40px 0 40px;
		min-width: 90%;
	}

	/* live tab-menu */
	#program .tab-menu-wrapper {
		overflow-x: auto;
	}
	#program .tab-menu-container {
		margin: 0;
		justify-content: flex-start;
		overflow: visible;
		width: 100%;
	}
	#program .tab-menu-container li {
		min-width: 40%;
		flex-shrink: 0;
		flex-grow: 2;
	}
	#program .tab-menu-container li a:hover {
		border: 2px solid #fff;
	}
	#program .tab-menu-container li.selected a {
		border: 2px solid #555;
	}

	/* faq */
	#faq h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	#faq .wrap {
		width: 94%;
		padding: 40px 0 30px;
	}
	#faq .question {
	  padding: 15px 10px;
	}
	
	#faq .question p {
	  font-size: 13px;
	}
	
	/* 回答部分 */
	#faq .answer {
	  padding: 0 16px;
	  font-size: 13px;
	}
	/* sponsor */
	#sponsor {
		padding: 40px 0;
		background: url(../../images/common/sponsor_bg_parts.png) no-repeat top right/contain;
	}
	#sponsor h2 {
		font-size: 30px;
		margin-bottom: 30px;
	}
	#sponsor h3 {
		font-size: 20px;
	}
	#sponsor h3 span {
		font-size: 14px;
		margin:  10px 0 0;
	}
	#sponsor ul.sponsor_list {
		width: 95%;
		padding: 40px 10px;
		margin: 0 auto 20px;
		gap: 30px 40px;
		flex-wrap: wrap;
	}
	#sponsor ul.sponsor_list.silver {
		padding: 40px 10px;
	}
	#sponsor ul.sponsor_list li {
		width: 40%;
	}
	#sponsor ul.sponsor_list.platinum li {
		width: 70%;
	}
	#sponsor ul.sponsor_list.gold li {
		width: 60%;
	}
	#sponsor ul.sponsor_list.bronze li {
		width: 30%;
	}
	#sponsor ul.sponsor_list.sponsorship li {
		width: 30%;
	}
	#sponsor ul.sponsor_list li.tsh {
		width: 70%;
	}

	/* register */
	div.register {
		padding: 50px 0;
	}
	div.register a.box-button {
		width: 60%;
		font-size: 22px;
		padding: 12px 0;
	}
	/* movie */
	#movie {
		padding: 40px 0;
	}
	#movie h2 {
		font-size: 30px;
	}
}