.welcome {
				width: 100%;
				max-width: 100%;
				padding: 75px 0 45px;
				position: relative;
				color: #fff;
				text-align: center;
				background-color: #009ec9;
}

.welcome .bottom {
				height: 20px;
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0;
				border-radius: 20px 20px 0 0;
				background-color: #f4f6f9;
}

.welcome .headline {
				font-size: 145%;
}

.main u {
				color: #009ec9;
				text-decoration: unset;
}

.main .wrap {
				padding: 0 15px 15px;
}

.main .index {
				display: block;
}

.main .categories {
				display: none;
}

.main .index .head,
.main .categories .head {
				margin-bottom: 15px;
				overflow: hidden;
				position: relative;
				text-align: center;
}

.main .index .head .headline,
.main .categories .head .headline {
				font-size: 115%;
}

.main .index .item,
.main .categories .item {
				height: 50px;
				margin-bottom: 15px;
				padding: 15px 55px 15px 15px;
				overflow: hidden;
				position: relative;
				text-align: right;
				cursor: pointer;
				border-radius: 25px;
				background-color: #fff;
				box-shadow: 0 1px 2px rgba(0,0,0,.07);
}

.main .index .item .icon,
.main .categories .item .icon {
				height: 40px;
				width: 40px;
				position: absolute;
				top: 5px;
				right: 5px;
				font-size: 185%;
				text-align: center;
				color: #fff;
				line-height: 40px;
				border-radius: 25px;
				background-color: #12b886;
}

.main .index .item-mark .icon,
.main .categories .item-mark .icon {
				background-color: #009ec9;
}

.main .index .item:last-child,
.main .categories .item:last-child {
				margin-bottom: 0;
}

.main .modal {
				display: none;
}

.main .modal .card {
				padding: 15px;
				overflow: hidden;
				position: relative;
				text-align: right;
				border-radius: 20px;
				background-color: #fff;
				box-shadow: 0 1px 2px rgba(0,0,0,.07);
}

.main .modal .card .head {
				margin-bottom: 30px;
				text-align: center;
}

.main .modal .card .head .icon {
				width: 60px;
				height: 60px;
				margin: auto;
				margin-bottom: 10px;
				display: block;
				font-size: 255%;
				color: #919fb1;
				line-height: 60px;
				border-radius: 5px 5px 40px 40px;
				background-color: #f1f1f1;
}

.main .modal .card .inner {
				line-height: 1.7;
				text-align: justify;
}

.main .modal .card .list {
				margin: 30px 0;
				list-style: none;
}

.main .modal .card .list:last-child {
				margin-bottom: 0;
}

.main .modal .card .list .item {
				margin-bottom: 15px;
				padding-right: 15px;
				position: relative;
}

.main .modal .card .list .item:last-child {
				margin-bottom: 0;
}

.main .modal .card .list .item:before {
				width: 3px;
				position: absolute;
				top: 0;
				right: 0;
				bottom: 0;
				content: "";
				border-radius: 3px;
				background-color: #f1f1f1;
}

.main .modal .card .list .box {
				margin: 15px 0 0;
				padding: 10px;
				overflow: hidden;
				border-radius: 3px;
				background-color: #f1f1f1;
}

.main .modal .card .list .mark {
				min-width: 40px;
				padding: 0 5px;
				overflow: hidden;
				display: inline-block;
				vertical-align: middle;
				color: #fff;
				text-align: center;
				border-radius: 3px;
				background-color: #12b886;
}

.main .show {
				display: block;
}
